Impossible d'obtenir un objet JSON en réponse à une requête Ajax avec wp_ajax

Question

Impossible d'obtenir un objet JSON en réponse à une requête Ajax avec wp_ajax

4

266600 2014-11-17

J'ai unproblème avec WordPresset Ajax.

Voicimapartie JavaScript (je l'ai unpeu rognée):

 var posts = $.ajax({
    type: 'POST',
    url: ajaxurl,
    async: false,
    dataType: 'json',
    data: { action: 'myAjaxFunc' },
    done: function(response) {
        return response;
    }
}).responseText;

$.each(posts, function() {
    $('#someSelect').append( $('<option</option>').text(this.name).val(this.id) );
});

Mon code PHPest le suivant:

 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 ),
        );
    }

    header("Content-type: application/json");
    echo json_encode( $list );
    die;
}
add_action( 'wp_ajax_nopriv_myAjaxFunc', 'myAjaxFunc' );
add_action( 'wp_ajax_myAjaxFunc', 'myAjaxFunc' );

Le script obtient la réponse Ajax de admin-ajax. Malheureusement,la console renvoie uneerreur lorsqu'elle arrive à l'instruction each dans le code JavaScript ...elle dit:

 "Uncaught TypeError: Cannot use 'in' operator to search for '4' in Array".

Sije fais un console.log demes "posts" varj'obtiens une chaîne "Array". Peuimporte commentje passe la variable $listen PHP,elle retourneratoujours une chaîne. La requête renvoie des articles ailleurs,ellen'est doncpas vide. J'aiessayé sans json_encode,avecet sans déclarer l'en-tête,en utilisant wp_send_json(),en mettant ob_clean() avant defaire écho autableau,en mettant letableau dans untableau ... Maisilentretoujours dans ajax comme une chaîne Arrayet eachne peutpas leparcourir.

Cela devrait être une chosetrès simpleet jene comprendspaspourquoi celane fonctionnepas. Jen'aipas d'autreserreurs ou avertissements JavaScript ou PHPet tout le restefonctionne correctement.

I have a problem with WordPress and Ajax.

This is my JavaScript part (I trimmed it a bit):

var posts = $.ajax({
    type: 'POST',
    url: ajaxurl,
    async: false,
    dataType: 'json',
    data: { action: 'myAjaxFunc' },
    done: function(response) {
        return response;
    }
}).responseText;

$.each(posts, function() {
    $('#someSelect').append( $('<option</option>').text(this.name).val(this.id) );
});

My PHP code is as follows:

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 ),
        );
    }

    header("Content-type: application/json");
    echo json_encode( $list );
    die;
}
add_action( 'wp_ajax_nopriv_myAjaxFunc', 'myAjaxFunc' );
add_action( 'wp_ajax_myAjaxFunc', 'myAjaxFunc' );

The script gets the Ajax response from admin-ajax. Unfortunately the console throws an error when it gets to the each statement in the JavaScript code... it says:

"Uncaught TypeError: Cannot use 'in' operator to search for '4' in Array".

If I do a console.log of my "posts" var I get a string 'Array'. No matter how I pass the $list variable in PHP it will always return a string. The query returns posts elsewhere, so it's not empty. I tried without json_encode, with and without declaring header, using wp_send_json(), putting ob_clean() before echoing the array, putting the array into an array... But it always gets into ajax as a string Array and each cannot cycle through it.

This should be a very simple thing and I can't understand why it's not working. I don't have other JavaScript or PHP errors or warnings and everything else runs fine.

- Que voyez-vous lorsque vous accédez à http://www.example.com/wp-admin/admin-ajax.php?action=myAjaxFunc
  
  What do you see when you go to http://www.example.com/wp-admin/admin-ajax.php?action=myAjaxFunc
  - 0
  - 2014-11-17
  - czerspalace
- Desprogrès sur votre question?Pourriez-vous s'il vousplaîtfaire un suivi?
  
  Any progress on your question? Could you please follow up?
  - 0
  - 2015-04-15
  - kaiser
- oh ... c'est d'il y a 5mois ... J'ai répondu àmapropre questionpar lafaçon dont le lendemainje l'aipostée,en utilisant desmorceaux de réponse BODA82 -je ne l'ai simplementpasmarquée comme labonne réponse;@toscho a ajouté son suivibeaucoupplustard hier,je nepeuxpas vérifier si sa réponseest égalementbonnemaintenant,c'est logique cependant
  
  oh... this is from 5 months ago... I did answer to my own question by the way the next day I posted it, using bits of BODA82 answer - I just didn't marked it as the correct answer; @toscho added his follow up much later yesterday I can't verify if his answer is also good now, it makes sense though
  - 0
  - 2015-04-16
  - unfulvio

3 réponses

votes

2

2014-11-17

Presque là avec votrefonction PHP. Pasbesoin de définir l'en-tête. (Modifier: Deplus,en supposant que get_posts() renvoie réellement des résultats.)

 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' );

Et votre 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.');
    }
});

Almost there with your PHP function. No need to set the header. (Edit: Also, assuming get_posts() is actually returning results.)

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' );

And your 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.');
    }
});

Lorsque vousenregistrez des donnéesen utilisant JSON.stringify ()et que vous devez les lireen php.Le code suivant afonctionnépourmoi.json_decode (html_entity_decode (striplashes ($jsonString)));

When you save some data using JSON.stringify() and then need to read that in php. The following code worked for me. json_decode( html_entity_decode( stripslashes ($jsonString ) ) );
- 0
- 2019-12-04
- Vishal Tanna

2

2015-04-15

Il y a uneissue.Utilisez complete au lieu de success ou done:

 posts = $.ajax({
    type: 'GET',
    url: ajaxurl,
    async: false,
    dataType: 'json',
    data: { action : 'getHotelsList' },
    complete: function(results) {

Etessayez de supprimer async:false si leproblèmepersiste.

There is a way out. Use complete instead of success or done:

posts = $.ajax({
    type: 'GET',
    url: ajaxurl,
    async: false,
    dataType: 'json',
    data: { action : 'getHotelsList' },
    complete: function(results) {

And try to remove async:false if the problem persists.

unfulvio · Accepted Answer · 2014-11-18

8

2014-11-18

La réponse de BODA82 m'a aidé,maisj'aifinalement réalisé quej'aurais dû remplacer responseTextpar laméthode responseJSON dansmon code JavaScript. Dans l'exemple ci-dessous,je stockais les résultats de la réponse Ajax dans une variable. Jene savaispas qu'il y avait uneméthode spécifiquepour obtenir la réponseen JSON. De cettemanière,l'objet/tableau avec les résultats get_posts()est renvoyé correctementet non sousforme de chaîne:

 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

Note àmoi-même,mais aussi des conseilsgénéraux: si vousne pouvezpas réparer quelque chose le soir,c'est un signe que vous devez aller vous coucher,lire un livreet compter les étoiles. Une réponse seratrouvée le lendemainmatin,leplustôt sera lemieux: D

BODA82's answer helped, but eventually I realized that I should have replaced responseText with responseJSON method in my JavaScript code. In the example below I was storing the Ajax response results in a variable. I didn't know there was a specific method to get the response in JSON. In a such way the object/array with get_posts() results is returned correctly and not as a string:

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

Note to self, but also general advice: if you can't fix something in the evening it's a sign you should go to bed, read a book, and count stars. An answer will be found the next morning, the earlier the better :D