I've setup the basic wordpress ajax example in my wp theme. The trigger is made by modernizr.js checking the media queries on the page.
jQuery(document).ready(function($) {
if(Modernizr.mq('only all and (max-width:6300px)')) {
var data = {
action: 'my_action',
whatever: ajax_object.we_value // We pass php values differently!
};
// We can also pass the url value separately from ajaxurl for front end AJAX implementations
jQuery.post(ajax_object.ajax_url, data, function(data) {
$("#trending-Container").html(data).fadeIn(1000);
});
}
});//end function
I have localized and enqueue'd my scripts.
wp_enqueue_script('mainJS', get_template_directory_uri() . '/js/mainJS.js', array("jquery") );
wp_localize_script( 'mainJS', 'ajax_object',
array( 'ajax_url' => admin_url( 'admin-ajax.php' ), 'we_value' => 1234 ) );
and finally the function that handles the request is:
add_action('wp_ajax_my_action', 'my_action_callback');
add_action('wp_ajax_nopriv_my_action', 'my_action_callback');
function my_action_callback() {
global $wpdb;
$whatever = intval( $_POST['whatever'] );
$whatever += 10;
echo $whatever;
die();
}
This constantly gives me a response of 0 (no properties) and I do not know why. P.S This is all local.
Status code 200
Host:lart.co.uk
Origin:http://lart.co.uk
Referer:http://lart.co.uk/
User-Agent:Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Ubuntu Chromium/28.0.1500.71 Chrome/28.0.1500.71 Safari/537.36
X-Requested-With:XMLHttpRequest
Form Dataview sourceview URL encoded
action:my_action
whatever:1234
Add the "exit" end of the function as shown below, this will fix the return 0 with the response in WordPress on using the ajax request.
add_action('wp_ajax_nopriv_getStateList', 'getStateList');
add_action('wp_ajax_getStateList', 'getStateList');
function getStateList() {
global $wpdb;
$countryId = $_POST['countryId'];
$results = $wpdb->get_results("SELECT id,name FROM regions where country_id ='".$countryId."' ");
echo json_encode(array('status'=>200,'data'=>$results));
exit;
}
Everything has to match here:
PHP
add_action('wp_ajax_my_action', 'my_action'); add_action('wp_ajax_nopriv_my_action', 'my_action'); function my_action() {}
JS
var data = { action: 'my_action', whatever: ajax_object.we_value };
Also, you're missing security checks and a better handling of the response.
Check this examples: [ 1 ] and [ 2 ].
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With