AjaxWordpress

WordPress Ajax working example

wordpress
627Views

Hello to all, welcome to therichpost.com. In this post, I will tell you, WordPress Ajax working example.

If you are new in WordPress then please check old post related to WordPress.

In this post, I am showing very simple WordPress Ajax working example but sometime this takes lot of time to find the solution.


Here is I am showing the working code snippet and please follow carefully:


1. Here is the code and you can add this code into any of your theme’s template file:

<!-- Button Click for fire ajax request -->
<button type="submit" class="btn btn-default" id="addProductUrl">Submit</button>


<!-- Ajax Request Code -->
<script>
  jQuery(document).ready(function($) {
    $("#addProductUrl").click(function(event) {
      event.preventDefault();
      /* Act on the event */
      var formData = new FormData();
      formData.append('action', 'foobar');
      formData.append('id', '12345');
      $.ajax({
          url: '<?php echo admin_url('admin-ajax.php'); ?>',
         type: 'post',
         contentType: false,
         processData: false,
         data: formData,
         success: function (response) {
             //Get Ajax request response
             console.log(response)
             
         },
         error: function (response) {
          console.log(response)
         }
     });
    });
  });
</script>

 

 

2. Here is the working code and you need to add into theme’s functions.php file:

add_action( 'wp_ajax_foobar', 'my_ajax_foobar_handler' );
add_action('wp_ajax_nopriv_foobar', 'my_ajax_foobar_handler'); 
function my_ajax_foobar_handler() {
    echo $_POST['id'];

   die();
}

 

 

This is it. If you have any query related to this post, then please do comment below or ask question.

Harjas

Thank you

Ajay Malhotra
the authorAjay Malhotra
Hello to all. Welcome to therichpost.com. Myself Ajay Malhotra and I am full stack developer. I love coding. I know Wordpress, Core php, Angularjs, Angular 2, Angular 6, Angular 7, laravel, Codeigniter, Shopify, Squarespace, Jquery, Google Map Api, Vuejs, Reactjs, Bigcommerce etc.

Leave a Reply

Positive SSL