functions.php
//Localize the AJAX URL and Nonce
add_action('wp_enqueue_scripts', 'example_localize_ajax');
function example_localize_ajax(){
wp_localize_script('jquery', 'ajax', array(
'url' => admin_url('admin-ajax.php'),
'nonce' => wp_create_nonce('example_ajax_nonce'),
));
}
//Example AJAX Function
add_action('wp_ajax_example_function', 'example_function');
add_action('wp_ajax_nopriv_example_function', 'example_function');
function example_function(){
if ( !wp_verify_nonce($_POST['nonce'], 'example_ajax_nonce') ){
die('Permission Denied.');
}
$firstname = sanitize_text_field($_POST['data']['firstname']);
$lastname = sanitize_text_field($_POST['data']['lastname']);
//Do something with data here
echo $firstname . ' ' . $lastname; //Echo for response
wp_die(); // this is required to terminate immediately and return a proper response:- https://codex.wordpress.org/AJAX_in_Plugins
}
example.js
jQuery(document).on('click touch tap', '.example-selector', function(){
jQuery.ajax({
type: "POST",
url: ajax.url,
data: {
nonce: ajax.nonce,
action: 'example_function',
data: {
firstname: 'John',
lastname: 'Doe'
},
},
success: function(response){
//Success
},
error: function(XMLHttpRequest, textStatus, errorThrown){
//Error
},
timeout: 60000
});
return false;
});