I want to pass a filename to a jQuery script. The complete path is set as a variable in a php file called $filerurl. jQuery should open the file, using the path and filename in that variable, but it is not working at all. Is there something wrong with using url: "", or is the variable not being passed to the script for some reason?
If I hardcode the filename into the jQuery script it works.
jQuery(document).ready(function() {
"use strict";
jQuery.ajax({
type: "GET",
url: "<?php echo $fileurl?>",
dataType: "text",
success: function(data) {processData(data);}
});
});
Thanks!
Related
Here my jQuery ajax code
jQuery.ajax({
url:'login.php',
});
How can I add site path in (url:'login.php') like we define site path in php define('SITE_PATH','http://127.0.0.1/project/');
I want to use this SITEPATH in url:'login.php'; to display url:'http://127.0.0.1/project/login.php';
Can anyone tell me how can I do it?
Absolute URL is a good idea in ajax. Just declared var siteURL = www.example.com; globally. And used this in every ajax request like below:-
<script>
$.ajax({
url: siteURL + '/path/to/file',
type: 'POST',
data: {param1: 'value1'},
});
</script>
I want to pass a value from my jquery code to a php variable after a user inputs through a textbox, but I don't receive any value at all in the PHP side through POST.I'm using .change and .post, does anyone here knows how to do it properly?
here's my code:
$(document).ready(function(){
$("#packagename").change(function(){
var packagename = $('#packagename').val();
var url = '{{url}}'; //localhost/test/test.php
$.ajax({
type: 'post',
url: url,
dataType:html,
data:{'val':packagename},
});
});
});
try it
$(document).ready(function(){
$("#packagename").change(function(){
var packagename = $('#packagename').val();
var url = '{{url}}'; //localhost/test/test.php
$.ajax({
type: 'post',
url: url,
dataType:text,
data:{'val':packagename},
success:function(result){
alert(result);
}
});
});
});
The only problem that I can see offhand is that the html in dataType:html, needs to have quotes around it like this: dataType: 'html',. Otherwise your code will look for the variable html, not find it, and throw an error.
http://api.jquery.com/jQuery.post/
dataType
Type: String
The type of data expected from the server. Default: Intelligent Guess (xml, json, script, text, html).
change dataType: html, to dataType: 'html',
Have you tried just putting the url into the url field instead of whatever that object is you are trying to use?
I will assume you are not trying to ajax to the page you are currently on and expecting the php variable to display on the current page.
I have a custom jquery file in a wordpress site and I am trying to use the bloginfo('template_directory') assigned to a variable to use in the ajax url paths rather than having to type out the full url each time (especially as this is in development on a test site at the moment so need to ensure everything works when moving to the live site on the actual domain), however all that happens is that the php is added to the url, not the directory path.
What I have at the moment:
$(document).ready(function(){
var templateDir = "<?php bloginfo('template_directory') ?>";
// Login
$('.login-form').on('submit', function(e){
e.preventDefault();
dataString = $(this).serialize() + '&ajax=1';
$.ajax ({
type: "POST",
url: templateDir + "/inc/do-login.php",
data: dataString,
cache: false,
success: function(data)
{.
.
.
}
});
});
And what I get in the console error is (site url replaced with ...):
POST http://www......./...../%3C?php%20get_bloginfo('template_directory')%20?%3E/inc/do-login.php 404 (Not Found)
Can anyone shed any light on this please.
You need to create a Javascript snippet that saves the template dir in a variable, and you can use later using that variable
<script type="text/javascript">
var templateDir = "<?php bloginfo('template_directory') ?>";
</script>
You need to move your templateDir variable out of your javascript file. The reason is because your php will not be interpreted. This means your templateDir variable will literally be equal to "<?php bloginfo('template_directory') ?>";
Luckily you can can still use javascript variables from other scripts or in your html directly.
Here is one solution.
This is your similar to your script but with a few modifications. Read carefully.
$(document).ready(function(){
// Login
$('.login-form').on('submit', function(e){
e.preventDefault();
dataString = $(this).serialize() + '&ajax=1';
$.ajax ({
type: "POST",
url: custom.templateDir + "/inc/do-login.php",
data: dataString,
cache: false,
success: function(data)
{
}
});
});
Now in your functions.php you can use use this trick to add javascript variables that can be accessed by your script:
function custom_init_js()
{
wp_enqueue_script('jquery');
wp_localize_script('jquery', 'custom', array(
'templateDir' => get_bloginfo('template_url')));
}
add_action('get_header', 'custom_init_js');
This will result in the following snippet of javascript being added your html pages.
<script type='text/javascript'>
/* <![CDATA[ */
var custom = {"templateDir":"https://www.website.org/wp-content/themes/yourTheme/"};
/* ]]> */
Now you can assess your template directory by using custom.templateDir in your script. The custom object comes from the wp_localize_script function. You can name this whatever you want.
Additionally you want to use get_bloginfo('template_url'), since template_dir will get you the file path and not the url, which is what you want.
When using this approach, the wp_localize_script is called only when you load the specified script with wp_enqueue_script. In this case, I used jquery.
wp_localize_script is mainly used for internationalization, but can be used to other data.
Here is the codex page: http://codex.wordpress.org/Function_Reference/wp_localize_script
I use this jquery-ajax script to send email:
$.ajax({
url: process.php,
type: "POST",
data: data,
cache: false,
...
in url I call the php file that sends email, but ajax get it only if I specify the full path:
url: "http://www.domain.com/wp-content/themes/site_theme/templates/process.php",
but I have to use a syntax like this:
url: "../../templates/process.php",
or using a variable to declare in the html header/footer
Html
<script type="text/javascript">
var urlMail = '<?php bloginfo('template_url'); ?>/templates/process.php';
</script>
Script
url: "../../templates/process.php",
but with both the above cases the browser console retrieves this error:
POST http://www.domain.com/templates/process.php 404 Not Found 1.56s
Where am I wrong?
That's not the way to implement ajax in wordpress. All ajax request should be made to admin-ajax.php.
In your template file:
<script type="text/javascript">
var ajaxurl = '<?php echo admin_url('admin-ajax.php'); ?>';
</script>
In your js:
$.ajax({
url: ajaxurl,
type: "POST",
cache: false,
data: data + '&action=sendmail' //action defines which function to use in add_action
});
in your functions.php:
function send_my_mail(){
#do your stuff
}
add_action('wp_ajax_sendmail', 'send_my_mail');
add_action('wp_ajax_nopriv_sendmail', 'send_my_mail');
Read about Ajax in Plugins.
I would be recommended to you use system like Registry for save all "global" values in a one place.
Registry design pattern
There is my small jQuery plugin if this is may be interesting to you. GitHub rep
<script type="text/javascript">
$.Registry.set('urlMail', '<?php get_bloginfo('template_url'); ?>/templates/process.php';
</script>
And to get value from the Registry you must use $.Registry.get('urlMail');
I've solved using the code provided by RRikesh but replacing
data: data
with
data: data + '&action=sendmail'
I'm currently trying to write a wordpress plugin. Basically it's a Form that is send to a PHP file via jQuery. (I've used the Code shown in this Tutorial:) Unfortunately I don't know how to link to that PHP file inside jQuery. The Problem is, that I have enabled SEO friendly URL's in Wordpress, so when I'm using the following Code:
$.ajax({
type: "POST",
url: "file.php",
data: dataString,
success: function() {
$('.done').fadeIn('slow');
}
});
The Server assumes the PHP file to be located at http://seofriendlylinktomypost/file.php .
Hopefully someone can help me and thanks in advance =).
I'm sorry for my awful English, I hope you understood everything^^
Create a php folder under your theme and then link in this way:
$.ajax({
type : "POST",
url : "<?php bloginfo('template_url'); ?>/php/file.php",
data : dataString,
success : function() {
$('.done').fadeIn('slow');
}
});
There is also other way. Place an empty A tag with an id attribute (like mytemplatebase) and href=bloginfo('template_url') in the template, then you can use:
var urlBase = $('a#mytemplatebase').attr('href');
$.ajax({
type: "POST",
url: urlBase+"/file.php",
data: dataString,
success: function() {
$('.done').fadeIn('slow');
}
});