WordPress Development Stack Exchange is a question and answer site for WordPress developers and administrators. Join them; it only takes a minute:

Sign up
Here's how it works:
  1. Anybody can ask a question
  2. Anybody can answer
  3. The best answers are voted up and rise to the top

n this basic plugin skeleton, I am trying to get the data sent by ajax to wordpress admin-ajax.php to be processed by a custom function.

It looks like the data send from the form does not reach my ea_ajax_handler() function. It seems to arrive to admin-ajax.php (the form data is collected by jQuery, then I get a 200 response for the post request to admin-ajax.php), but it looks like it not forwarded to ea_ajax_handler().

Here are my files:


/** Enqueue scripts */
add_action('wp_enqueue_scripts', 'ea_scripts');

function ea_scripts()
    // easyA script in the footer
    wp_register_script('easyA', plugins_url('js/easyA.js', __FILE__), array('jquery'), '', true);
    wp_enqueue_script('easyA'); // wondering if it's really needed or if the previous line is enough...
    wp_localize_script('easyA', 'easyAVars', array('ajaxUrl' => admin_url('admin-ajax.php')));

/** Shortcode to display form in pages / posts */

function ea_display_form()
    echo '
        <form id="eaForm">
            <input type="text" name="username" />
            <input type="submit" value="Submit" />

/** Event handling */
add_action('wp_ajax_ea_ajax_handler', 'ea_ajax_handler');
add_action('wp_ajax_nopriv_ea_ajax_handler', 'ea_ajax_handler');

function ea_ajax_handler() 
    $json = array(
        'success' => false,
        'result'  => 0

    if (isset($_POST['username'])) {
        $result = 'Hi, ' . $_POST['username'] . '!';

        $json['success'] = true;
        $json['result'] = $result;

    echo json_encode($json);


jQuery(document).ready(function($) {
    $('#eaForm').on('submit', function() {
        var that = $(this),
            contents = that.serialize();

        console.log('contents: ' + contents); // debugging
            url: easyAVars.ajaxUrl,
            dataType: 'json',
            type: 'post',
            data: contents,
            action: 'ea_ajax_handler', // function in easyA.php that will be triggered
            success: function(data) {

        return false;
share|improve this question
The action should be added to contents. so after setting contents and before the ajax call, add a line that says contents.action = 'ea_ajax_handler' – czerspalace Mar 24 '14 at 17:40
@czerspalace Thank you but adding contents.action = 'ea_ajax_handler'; right after contents = that.serialize(); didn't work. – Iam Zesh Mar 25 '14 at 10:14
that.serialize() doesn't create a jQuery object, it creates a string with form: username=Smith. So to add the action you'd need to concatenate the string. contents = that.serialize + '&action=ea_ajax_handler (untested) – helgatheviking Mar 25 '14 at 11:10
up vote 0 down vote accepted

As czerspalace mentioned you need to pass the action to the .ajax().

One way to do this would be to modify your form:

function ea_display_form()
    echo '
        <form id="eaForm">
            <input type="text" name="username" />
            <input type="submit" value="Submit" />
            <input type="hidden" name="action" value="ea_ajax_handler" />
share|improve this answer
This worked like a charm. Actually, I also removed action: 'ea_ajax_handler', in the ajax() which seemed not to be needed (still working without it). – Iam Zesh Mar 25 '14 at 10:16
Great! If you review the Codex you'll see that action is only passed inside the data object... by itself it is meaningless to the .ajax() function. – helgatheviking Mar 25 '14 at 11:12
Thank you for this (sorry can't +1 your comment, not enough rep yet)! – Iam Zesh Mar 25 '14 at 16:19

Your Answer


By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.