JQuery.ajaxの成功データからJSONをパースする

質問

JQery.ajaxの呼び出しからJSONオブジェクトの内容を取得するのに苦労しています。私の呼び出し。

$('#Search').click(function () {
    var query = $('#query').valueOf();
    $.ajax({
        url: '/Products/Search',
        type: "POST",
        data: query,
        dataType: 'application/json; charset=utf-8',
        success: function (data) {
            alert(data);
            for (var x = 0; x < data.length; x++) {
                content = data[x].Id;
                content += "<br>";
                content += data[x].Name;
                content += "<br>";
                $(content).appendTo("#ProductList");
               // updateListing(data[x]);
            }
        }
    });
});

以下のように "alert(data)" が表示されるので、JSONオブジェクトは正しく返されているようです。

[{"Id": "1", "Name": "Shirt"}, {"Id": "2", "Name":"Pants"}]

を使って、IdやNameをページに表示させてみると。

content = data[x].Id;
content += "<br>";
content += data[x].Name;
content += "<br>";

を実行すると、ページに "undefined" が返されます。私は何を間違えているのでしょうか？

助けてくれてありがとうございます。

どのように解決するのですか？

データがJSONの文字列表現として戻ってくるので、それをJavaScriptのオブジェクトに変換して戻していない。を設定します。 dataType を単なる 'json' に変更すると、自動的に変換されます。