I'm getting the following XML response back from a Wordpress AJAX request and having trouble extracting the data. I think it's because it's being parsed as CDATA, but I can't see why.
<?xml version="1.0" encoding="UTF-8"?>
<wp_ajax>
<response action="mz_mindbody_ajax_add_to_class_0">
<object id="0" position="1">
<response_data><![CDATA[error]]></response_data>
<supplemental>
<classID><![CDATA[2237]]></classID>
<message><![CDATA[Error in add to class (2237)]]></message>
</supplemental>
</object>
</response>
</wp_ajax>
This is the php to handle the AJAX call:
<script type='text/javascript'>
/* <![CDATA[ */
var my_parameters = {"ajaxurl":"http:\/\/localhost:8888\/wp-admin\/admin-ajax.php"};
/* ]]> */
</script>
<?php
// Ajax Handler
add_action( 'wp_ajax_my_ajax_handler', 'my_ajax_handler' );
function my_ajax_handler() {
// Get the Post ID from the URL
$classID = $_REQUEST['classID'];
// Instantiate WP_Ajax_Response
$response = new WP_Ajax_Response;
if( wp_verify_nonce( $_REQUEST['nonce'], 'nonce-name' . $classID )){
//Do something here
$response->add( array(
'data' => 'success',
'supplemental' => array(
'classID' => 'did it',
'message' => 'Class ID goes here', // ideally want to show $classID
),
) );
} else {
// Build the response if an error occurred
$response->add( array(
'data' => 'error',
'supplemental' => array(
'classID' => 'nothing to see here',
'message' => 'Error in add to class',
),
) );
}
// Whatever the outcome, send the Response back
$response->send();
// Always exit when doing Ajax
exit();
}
//End Ajax
This is the jQuery code:
(function($){
$(document).ready(function($) {
$( '.my_class' ).click( function( e ) {
var link = this;
var id = $( link ).attr( 'data-id' );
var nonce = $( link ).attr( 'data-nonce' );
// This is what we are sending the server
var data = {
action: 'my_function',
classID: id,
nonce: nonce
}
// Change text of link
$( link ).text( 'DOING IT' );
// Post to the server
$.post( my_parameters.ajaxurl, data, function( data ) {
// Parse the XML response with jQuery
// Get the Status
console.log(data); //the XML data posted above
var status = $( data ).find( 'response_data' ).text();
// Get the Message
var message = $( data ).find( 'supplemental message' ).text();
// If we are successful, add the success message and remove the link
console.log(status); // empty string
if( status == 'success' ) {
$( link ).parent().after( '<p><strong>' + message + '</strong></p>').remove();
} else {
// An error occurred, alert an error message
alert( message );
}
});
// Prevent the default behavior for the link
e.preventDefault();
});
});
})(jQuery);
In the tutorial I'm following the $response->add()
calls are within a function. Is the fact that mine aren't what's causing the problem here?
Wait - I have misrepresented the data
"object", which may be part of (or all of) the problem. The entire data "object" is actually a string, which in the console looks like:
<script type='text/javascript'>
/* <![CDATA[ */
var mz_mbo_params = {"ajaxurl":"http:\/\/localhost:8888\/wp-admin\/admin-ajax.php"};
/* ]]> */
</script>
<?xml version='1.0' encoding='UTF-8' standalone='yes'?><wp_ajax><response action='mz_mindbody_ajax_add_to_class_0'><object id='0' position='1'><response_data><![CDATA[error]]></response_data><supplemental><classID><![CDATA[nothing to see here]]></classID><message><![CDATA[Error in add to class]]></message></supplemental></object></response></wp_ajax>