web-dev-qa-db-ja.com

Jsonオブジェクトの要素にアクセスできない

これはよりJSONの質問ですが、WordPressの中にあり、admin-ajax.phpによって処理されているので、このフォーラムに最も適していると思いました。以下に示すように、標準のAjaxフォームプロシージャを作成しました。

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

フロントエンドで返される結果は次のとおりです。

{"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"}

一見これはjsonオブジェクトのように見えますが、私はそれが信じられないのです。

私がやりたいことはオブジェクトの要素にアクセスすることですが、jqueryコードの成功の際にdataの代わりにdata[0]を与えると、得られるのは{、つまり文字列の最初の文字だけです。他の場所で提案されているようにJSON.parse(data)またはjQuery.parseJSON(data)を使用しようとしましたが、その後何も返されません。

私は一日中これで立ち往生しているように任意の助けは非常に高く評価されます...

ハリー

jqueryajaxjson
3
harman

現在返される結果は生のテキストです。これはdata[0]が string の最初の要素（つまりcharacter）、つまり{にアクセスすることを意味します。明らかに、返されたデータをJSONオブジェクトに変換したいのです。これを行うために、 jQuery.ajax() にはdataTypeと呼ばれる気の利いたプロパティがあり、これはjQueryがAJAX呼び出しから返されたデータを解釈する方法を決定します。可能な値は'xml'、'json'、'script'、および'html'です。コードのdataTypeパラメータを'json'に設定するだけで、設定は完了です。

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