web-dev-qa-db-fra.com

Impossible d'accéder aux éléments de l'objet json

C’est plus une question json mais comme elle est dans wordpress et est traitée par admin-ajax.php, j’ai pensé que cela conviendrait mieux à ce forum. J'ai créé une procédure de formulaire ajax standard, comme indiqué ci-dessous.

HTML:

<form action="" method="post" id="stock-search-form" />               
     <input class="stock-search-element" type="search" name="stock-search-name" id="stock-search-id"/>
     <input class="hide-me" type="hidden" name="action" value="process_stock" />
     <button class="stock-button" name="stock-button-name" id="stock-button-id" type="send">Search</button>                
</form>
<div class="stock-table-outer"></div>

PHP:

function process_stock() {
    $the_php_result = array("foo1" => "String_1", 
                            "foo2" => "String_2", 
                            "foo3" => "String_3", 
                            "foo4" => "String_4", 
                            "foo5" => "String_5", 
                            "foo6" => "String_6", 
                            "foo7" => "String_7", 
                            "foo8" => "String_8", 
                            "foo9" => "String_9", 
                            "foo10" => "String_10", 
                            "foo11" => "String_11", 
                            "foo12" => "String_12",
                            "foo13" => "String_13",
                            );
    echo json_encode($the_php_result);
}

JQUERY:

jQuery('#stock-search-form').submit(ajaxSubmit);

function ajaxSubmit(){

var StockSymbolUI = jQuery(this).serialize();

jQuery.ajax({
    type:"POST",
    url: "/wp-admin/admin-ajax.php",
    data: StockSymbolUI,
    success:function(data){
        jQuery(".stock-table-outer").show();
        jQuery(".stock-table-outer").html(data);
    }
});

return false;
}

Le résultat qui me revient au début est le suivant:

{"foo1":"String_1","foo2":"String_2","foo3":"String_3",
"foo4":"String_4","foo5":"String_5","foo6":"String_6",
"foo7":"String_7","foo8":"String_8","foo9":"String_9",
"foo10":"String_10","foo11":"String_11","foo12":"String_12",
"foo13":"String_13"}

À première vue, cela ressemble à un objet JSON mais je ne crois pas que ce soit le cas.

Ce que je veux faire, c’est accéder aux éléments de l’objet, mais si je donne data[0] au lieu de data dans le succès du code jquery, tout ce que j’obtiens est {, c’est-à-dire le premier caractère de la chaîne. J'ai essayé d'utiliser JSON.parse(data) ou jQuery.parseJSON(data) comme suggéré ailleurs, mais je ne reçois rien.

Toute aide serait très appréciée car je suis coincée avec cela pendant une journée entière ...

Harry

jqueryajaxjson
3
harman

Le résultat actuellement renvoyé est du texte brut, ce qui signifie que data[0] accède au premier élément (c'est-à-dire un caractère) du string , qui est {. De toute évidence, vous souhaitez transformer les données renvoyées en objet JSON. Pour ce faire, jQuery.ajax() a une propriété astucieuse appelée dataType, qui détermine la manière dont jQuery interprète les données renvoyées par l'appel AJAX. Les valeurs possibles sont 'xml', 'json', 'script' et 'html'. Définissez simplement le paramètre dataType sur 'json' dans votre code et le tour est joué!

jQuery.ajax( {
    type: 'POST',
    url: '/wp-admin/admin-ajax.php',
    data: StockSymbolUI,
    dataType: 'json',
    success: function( data ){
        jQuery( '.stock-table-outer' ).show();
        jQuery( '.stock-table-outer' ).html( data );
    }
} );
3
engelen