Problem running Ajax in WordPress

Question

1: the codex recommends enqueing all scripts and styles on the wp_enqueue_scripts() hook. this won’t solve the problem, but is good practice.

2: i think that all the data that goes INTO the php function is wrapped up in $_POST. which is sent by the .ajax call. so it doesn’t look like you are sending any data other than the action name and it doesn’t look like you are properly decoding the data in the PHP file.

i’d start out changing:

function pfxconversion () {
  echo "bacon"; exit();
}

just to ensure that you are talking to the ajax function. that part looks correct to me though.

what kind of info are are sending? some form data? you’ll need to serialize that and include it in the ajax call.

jQuery(document).ready(function() {

jQuery("#convert").click(function () {

     jQuery.ajax({
       type: "POST",
       url: MyAjax.ajaxurl,
       data: action='pfxconversion&bacon=hellyes',
       success: function(data){

       jQuery('#results').show();
       //Put received response into result div
       jQuery('#results').html(data);
       }
     });
});

then on the php side we can get at the post data like this:

function pfxconversion () {
      $data = $_POST;
      echo $data['bacon'];
      exit();
    }

in theory that should echo out the “hell yes” we set earlier.

you’re probably sending a form in which case you’d tack on $(‘#formID’).serialize() like so

var formdata = $('#formID').serialize();

then your data line in the ajax call would look like:

data: formdata + 'action=pfxconversion',

since you didn’t post what type of info you were trying to send (the HTML) I didn’t go ahead and do that, but hopefully you get the gist from my example.

EDIT:

so i took a look at admin-ajax.php and you can see 2 things. first, if the user is not logged in it will try to run

do_action( ‘wp_ajax_nopriv_’ . $_REQUEST[‘action’] );

this action doesn’t fire if you are logged in…. which i am on my local install where i am testing this.

so to ensure that this works for BOTH logged in and logged out users we need to add the action to both wp_ajax_ and wp_ajax_nopriv_

secondly, a zero response means that it admin-ajax.php went through all its own switch cases, and didn’t find an action.

default :
    do_action( 'wp_ajax_' . $_GET['action'] );
    die('0');
    break;
endswitch;

that’s the endtail of the code…. what it means for us is that it isn’t finding the action name.

so with that i made some tweaks and i am now getting a response:

jQuery(document).ready(function() {     
    $("#convert").click(function () { 

            var formdata = $('#conversionform').serialize();

        $.ajax({
            type: "POST",
            url: MyAjax.ajaxurl,
            data: 'action=pfxconversion&' + formdata,
            type: 'POST',
            cache: false,
            success: function (resp) { 
                console.log(resp);
            },
            error: function (err) {
                console.log(err);
            }
        });
        return false;
    });     
});

and on the php side:

add_action( 'wp_ajax_nopriv_pfxconversion', 'pfxconversion_callback' );
add_action( 'wp_ajax_pfxconversion', 'pfxconversion_callback' );

function pfxconversion_callback () {
    print_r($_POST);
    exit();
}

that should show an array of values from the form in your console… which means you’re now talking to the callback function successfully through ajax.

ps- you can add a hidden input with the action to the form.

<input type="hidden" name="action" value="pfxconversion" />

and then it’ll be pulled in automatically by serialize() and you won’t need to concatenate the string in the .ajax call

//edit

function add_my_scripts(){
wp_enqueue_script( 'pfxconversion', plugin_dir_url( __FILE__ ) . 'function.js', array( 'jquery' ) );
wp_localize_script( 'pfxconversion', 'MyAjax', array( 'ajaxurl' => admin_url( 'admin-ajax.php' ) ) );
}
add_action('wp_enqueue_scripts','add_my_scripts');

Leave a Comment Cancel reply