Solución:
La respuesta de BODA82 ayudó, pero finalmente me di cuenta de que debería haber reemplazado responseText
con responseJSON
método en mi código JavaScript. En el siguiente ejemplo, estaba almacenando los resultados de la respuesta Ajax en una variable. No sabía que había un método específico para obtener la respuesta en JSON. De tal manera, el objeto / matriz con get_posts()
los resultados se devuelven correctamente y no como una cadena:
posts = $.ajax({
type: 'GET',
url: ajaxurl,
async: false,
dataType: 'json',
data: { action : 'getHotelsList' },
done: function(results) {
// Uhm, maybe I don't even need this?
JSON.parse(results);
return results;
},
fail: function( jqXHR, textStatus, errorThrown ) {
console.log( 'Could not get posts, server response: ' + textStatus + ': ' + errorThrown );
}
}).responseJSON; // <-- this instead of .responseText
Nota para mí mismo, pero también un consejo general: si no puede arreglar algo por la noche, es una señal de que debe irse a la cama, leer un libro y contar estrellas. Se encontrará una respuesta a la mañana siguiente, cuanto antes, mejor: D
Casi ahí con su función PHP. No es necesario configurar el encabezado. (Editar: también, asumiendo get_posts()
en realidad está devolviendo resultados).
function myAjaxFunc() {
$posts = get_posts( array(
'posts_per_page' => -1,
'orderby' => 'title',
'order' => 'ASC',
'post_type' => 'my-post-type',
'post_status' => array( 'publish', 'draft' )
) );
$list = array();
foreach ( $posts as $post ) {
$list[] = array(
'id' => $post->ID,
'name' => $post->post_title,
'link' => get_permalink( $post->ID ),
);
}
echo json_encode( $list );
die;
}
add_action( 'wp_ajax_nopriv_myAjaxFunc', 'myAjaxFunc' );
add_action( 'wp_ajax_myAjaxFunc', 'myAjaxFunc' );
Y tu Javascript:
$.ajax({
url: "<?php bloginfo('url'); ?>/wp-admin/admin-ajax.php",
type: "POST",
data: "action=myAjaxFunc",
success: function(results) {
var posts = JSON.parse(results);
console.log(results);
$.each(posts, function() {
$('#someSelect').append( $('<option></option>').text(this.name).val(this.id) );
});
},
error: function() {
console.log('Cannot retrieve data.');
}
});
Hay una salida. Usar complete
en lugar de success
o done
:
posts = $.ajax({
type: 'GET',
url: ajaxurl,
async: false,
dataType: 'json',
data: { action : 'getHotelsList' },
complete: function(results) {
Y trata de eliminar async:false
si el problema persiste.