2

ドロップダウンボックスにJSONページのデータを入力しようとしています。

これが私が使用しているコードです:

<script type="text/javascript" charset="utf-8">
    $(document).ready(function () {
        $.ajax({
            url: "json/wcf.svc/GetTax",
            dataType: 'json',
            data: data
        });

        $($.parseJSON(data.msg)).map(function () {
            return $('<option>').val(this.value).text(this.label);
        }).appendTo('#taxList');
    });
</script>

そして、これがjsonデータが返すものです:

{"d":"{\"16\":\"hello\",\"17\":\"world\"}"}

「データが未定義です」というエラーが表示されます。どういうわけかJQにjsonデータの読み取り方法を教える必要がありますか?

4

2 に答える 2

4

まず、ajax呼び出しに渡すデータ変数が定義されていません(提供したコードサンプルではありません)。次に、ajax呼び出しが非同期で発生しているため、返されたデータを使用して、つまり、成功コールバック。例:

$(document).ready(function () {
    var data = //define here
    $.ajax({
        url: "json/wcf.svc/GetTax",
        dataType: 'json',
        data: data, // pass it in here
        success: function(data)
        {
            $(data.msg).map(function () {
                return $('<option>').val(this.value).text(this.label);
            }).appendTo('#taxList');
        }
    });       
});

また、jQueryが自動的にJSONを解析するため、ajax呼び出しから返されたデータを解析する必要はありません($ .parseJSON(data.msg)が必要です)。

編集

JSONの興味深い形式に基づいており、変更できないと仮定すると、これは機能するはずです(醜いですが)

$(document).ready(function () {
        var data = //define here
        $.ajax({
            url: "json/wcf.svc/GetTax",
            dataType: 'json',
            data: data, // pass it in here
            success: function(data)
            {
                 data = data.d.replace(/{/g, '').replace(/}/g, '').split(',');
                 var obj = [];
                 for (var i = 0; i < data.length; i++) {
                     obj[i] = {
                      value: data[i].split(':')[0].replace(/"/g, '').replace('\\', ''),
                      label: data[i].split(':')[1].replace(/"/g, '')
                     };
                 }
                 var htmlToAppend = "";
                 for (var j = 0; j < obj.length; j++) {
                     htmlToAppend += '<option value="' +
                         obj[j].value +
                         '">' + obj[j].label +
                         '</option>';
                 }
                 $('#taxList').append(htmlToAppend);
            }
        });       
    });
于 2013-03-03T20:59:26.480 に答える
1

successデータを返すには、このオプションを使用する必要があります。

<script type="text/javascript" charset="utf-8">
    $(document).ready(function () {
        $.ajax({
            url: "json/wcf.svc/GetTax",
            dataType: 'json',
            success: function(data){

           $(data.msg).map(function () {
            return $('<option>').val(this.value).text(this.label);
        }).appendTo('#taxList');

        }
        });


    });
</script>
于 2013-03-03T20:52:49.353 に答える