wp_ajax action responds with 0

Question

I'm writing a plugin. There is a button, that triggers an ajax-request to an action I added in my plugin page:

Head of my plugin PHP file:

add_action('wp_ajax_update_nav_items', 'update_nav_items' );
add_action('wp_ajax_nopriv_update_nav_items', 'update_nav_items' );

wp_enqueue_script( 'addItemToNav', plugin_dir_url( __FILE__ ) . 'js/navFunctions.js', array( 'jquery', 'json2' ) );
wp_localize_script( 'addItemToNav', 'menuItems', array(
    // URL to wp-admin/admin-ajax.php to process the request
    'ajaxurl'          => admin_url( 'admin-ajax.php' ),
    // generate a nonce with a unique ID "myajax-post-comment-nonce"
    'postCommentNonce' => wp_create_nonce( 'update_nav_items-nonce' ),
    'action' => 'update_nav_items'
    )
);
function update_nav_items() { 
    // Testing stuff 
    $response = json_encode( array( 'response' => 'success', 'html' => 'some value' ) );
    ob_clean();
    print_r( $response );
    echo json_encode( $response );

    die();
}

My JavaScript which triggers:

var data = {
    action: 'update_nav_items',
    postCommentNonce : menuItems.postCommentNonce,
    menuitems: JSON.stringify(itemtest)
};

jQuery.ajax({ 
    url: menuItems.ajaxurl, 
    data: data,  
    type: 'post',
    dataType: 'json',
    success: function( response ) {
        console.log(response);
    }
}); 

In the browser console, the request is sent to the correct url, including following parameters:

action  update_nav_items
menuitems   {"glossary":{"title":"example glossary","GlossDiv":{"title":"S","GlossList":{"GlossEntry":{"ID":"SGML","SortAs":"SGML","GlossTerm":"Standard Generalized Markup Language","Acronym":"SGML","Abbrev":"ISO 8879:1986","GlossDef":{"para":"A meta-markup language, used to create markup languages such as DocBook.","GlossSeeAlso":["GML","XML"]},"GlossSee":"markup"}}}}}
postCommentNonce    0cee7325b3

(menuitems is just for testing with correct JSON)

What I get as response is 0, so there seems to be a problem with the action. I just don't find it. I already tried adding actions also in my functions.php, it's still not working.

Anyone have a clue?

Answer 1

Change your wp_localize_script-Call to the right Action:

wp_localize_script( 'addItemToNav', 'menuItems', array(
    // URL to wp-admin/admin-ajax.php to process the request
    'ajaxurl'          => admin_url( 'admin-ajax.php' ),
    // generate a nonce with a unique ID "myajax-post-comment-nonce"
    'postCommentNonce' => wp_create_nonce( 'update_nav_items-nonce' ),
    'action' => 'wp_ajax_update_nav_items'
    )
);

As 'action' you currently Input the function Name, but that is wrong. Your registered Action to call the function has an different Name.

Answer 2

Your AJAX Requests requires an JSON to be returned. But I think your function doesn't return valid JSON.

Haven't tested it, but this function should work:

function update_nav_items() { 
    // Testing stuff 
    $response = json_encode( array( 'response' => 'success', 'html' => 'some value' ) ); // first JSON encode
    ob_clean();

    die(json_encode( $response )); // second JSON encode
}

For testing it, you can call the URL manually and have a look on the returned string, whether it's valid JSON or not.

Regards, lippoliv

Answer 3

Please follow the code:

add_action( 'wp_ajax_add_myfunc', 'prefix_ajax_add_myfunc' );
add_action( 'wp_ajax_nopriv_add_myfunc', 'prefix_ajax_add_myfunc' );

function prefix_ajax_add_myfunc() {
    // Handle request then generate response using WP_Ajax_Response
}

and in your ajax call do this:

jQuery.post(
    ajaxurl, 
    {
        'action': 'add_myfunc',
        'data':   'foobarid'
    }, 
    function(response){
        alert('The server responded: ' + response);
    }
);

in the ajax call you'll call your function without prefix_ajax_. Only call by it's remaining. In that case it's add_myfunc. In the response it will send done if everything goes right. Else response will be 0 or -1.

Hope it will help. Thank you.