How to call ajax in plugin file

Question

I am very new to ajax with wordpress . Here i am getting a selected option value in var test using bellow function when i alert it its showing a right value.

This var test value i have to send using ajax and i want GET this value in PHP variable.

So what i required to call ajax and get script variable value of var test in php in plugin file where i have both bellow function and select box.

JQuery Funtion.

jQuery("#time_slot").change(function()
{

var test= time_slot.value;
alert(test);

});

Select Box

<select name="time_slot" id="time_slot" class="time_slot">
<option value="">Choose a Time</option>
<option value="1:00 - 3:00">01:00 AM-03:00 AM</option>
<option value="3:00 - 5:00">03:00 AM-05:00 AM</option>
</select>

Answer 1

Use the built-in wordpress Ajax actions:

Your jquery will look like this:

$('#ajax_form').bind('submit', function() {
    var form = $('#ajax_form');
    var data = form.serialize();
    data.action = 'MyPlugin_GetVars'
    $.post('/wp-admin/admin-ajax.php', data, function(response) {
        alert(response);           
    });
return false; 

Your plugin code something like:

add_action("wp_ajax_MyPlugin_GetVars", "MyPlugin_GetVars");
add_action("wp_ajax_nopriv_MyPlugin_GetVars", "MyPlugin_GetVars");

function MyPlugin_GetVars(){
    global $wpdb;
    // use $wpdb to do your inserting

    //Do your ajax stuff here
    // You could do include('/wp-content/plugins/test/getvars.php') but you should
    // just avoid that and move the code into this function
}

For more info please visit AJAX in Plugins

Answer 2

please look at below, it may help to you. Here it is your PHP code.

<?php

function ajax_enqueuescripts() {
    wp_enqueue_script('ajaxloadpost', plugins_url().'/your-plugin-name/js/my-ajax.js', array('jquery'));
    wp_localize_script( 'ajaxloadpost', 'ajax_postajax', array( 'ajaxurl' => admin_url( 'admin-ajax.php' ) ) );
}

add_action('wp_enqueue_scripts', ajax_enqueuescripts);

add_action('wp_ajax_nopriv_ajax_ajaxhandler', 'my_action_callback' );
add_action('wp_ajax_ajax_ajaxhandler', 'my_action_callback' );

function my_action_callback(){  
    print_r($_GET);
    die;
}

And here it is your JS code. You need to create new JS file and put below code in your new JS file.

jQuery(document).ready(function(){
 jQuery("#time_slot").change(function()
{

    var test= time_slot.value;

jQuery.ajax({
        type: 'GET',
        url: ajax_postajax.ajaxurl,
        data: {
            action: 'ajax_ajaxhandler',
            test : test   
        },
        success: function(data) {
            alert(data);
        },
        error: function(XMLHttpRequest, textStatus, errorThrown) {
            alert("Error");
        }
    });

    return false;
  });
});

For more details, you can check here

Answer 3

Add this in Your Plugin php page

 add_action("wp_ajax_ajax_plugin_call", "ajax_plugin_call_callback"); 
 add_action("wp_ajax_nopriv_ajax_plugin_call", "ajax_plugin_call_callback");

Ajax Function in Php Page

function ajax_plugin_call_callback{
   global $wpdb;
   print_r($_POST) ; 
   // write your Php Code
   die;

}

Your Javascript Code like this

jQuery(document).ready(function(){
  jQuery('#formID').bind('submit', function() { // Form submit Button
      var form_value =  jQuery('#formID'); 
      var form_data = form_value.serialize(); //Serialize the Form 
      form_data['action']='ajax_plugin_call'; // Action 
     jQuery.post('<?php  echo admin_url('admin-ajax.php'); ?>',form_data,function(response){

         // Here is the Ajax Response

       });
    }
 }); 

Please Check this, it will provide you help in WordPress Ajax call in plugin.

Answer 4

I have call ajax using bellow code its working good. Here i am sending the variable time to this page using post $.post("'. plugins_url().'/woocommerce-booking/gettime.php",

var time=0;
jQuery("#time_slot").change(function()
                                {   
                                time=time_slot.value;
                            $.post("'. plugins_url().'/woocommerce-booking/gettime.php",
                                 {name: time},
                                  function(response){
                                  console.log(response);
                                  }
                                );  
                                 });

my gettime.php file will be look like bellow and getting response from my ajax call.

<?php session_start();
    echo $name= $_POST["name"];
    file_put_contents("name.txt", $name)

 ?>

Answer 5

You must first enqueue the script and define the URL. Then you have to create a function for your AJAX callback and add a WordPress action that calls it. Here is a video where I explain it, hope it helps. :)

https://www.youtube.com/watch?v=R7OK-TtNuEc