0

JSON から動的選択入力 (ドロップダウン メニュー) を作成したいと考えています。

ドロップダウン メニューの [選択] 入力用の JSON オブジェクトを取得する 2 つの方法を試しました (コメント アウトされた JS で試行 1 と試行 2 とラベルを付けました)。

クライアントに返される文字列がありますが、フロントエンドはそれを JSON オブジェクトとしてではなく、単なる文字列として認識しています。.NetシリアライザーとJson2 Parseの両方を使用して、解析およびシリアル化を試みました。

AJAX 呼び出し

function getcategories(categoryId) {

    $.ajax({
        type: 'POST',
        url: '/Services/Category.aspx/GetCategory',
        data: '{"categoryId":"' + categoryId + '"}',
        contentType: 'application/json; charset=utf-8',
        global: false,
        async: false,
        dataType: 'json',
        success: function (msg) {
            if (msg.d == null || msg.d == '') {
                //end of the road. not more categories. so don't add another DDL
                jsonList = '';
                console.log("No more DDLs: ");
            } else {
                //attempt 1: converting returned data to Json
                //var json = JSON.parse(msg.d);//just returns [object object]
                //jsonList = json.d;
                //attemp2: trying to consume stringbuilder string as Json
                //or if I do the below, I also get an error Table does not exist
                //jsonList = msg.d
            }
        }

    });
    return false;

}

返された JSON

{
    "Table": [{
        "categoryid": "0",
        "categoryname": "--Select Category1--"
    }, {
        "categoryid": "2",
        "categoryname": "subname2"
    }, {
        "categoryid": "3",
        "categoryname": "subname3"
    }, {
        "categoryid": "4",
        "categoryname": "subname4"
    }]
}

ここでループで使用しようとしています：

//simplified function inside the ready()
//add dynamic select with options from Json
$('<select id ="DDL' + nextSelect + '" class="cascade"><option value="-">-- Step' + nextSelect + ' --</option></select>').appendTo('div .chooseSteps');
console.log("Obj " + categoryJson); //shows the Json string 
console.log("TABLE " + categoryJson.Table); //returns undefined :(
var listItems = "";

//Says that Table does not exist (undefined)
for (var i = 0; i < categoryJson.Table.length; i++) {
    listItems += "<option value='" + categoryJson.Table[i].categoryid + "'>" + categoryJson.Table[i].categoryname + "</option>";
}

したがって、私の目標は、表示するオプションを取得し、テーブルの値を取得することです。

午後中ずっとフォーラムを検索しましたが、うまくいく解決策を見つけることができませんでした。わかってくれてありがとう。

Asp.Net 4でJson2.js（古いブラウザのバックアップとして）でjQuery 1.7.1 AJAXを使用しています。

4

3 に答える 3

1

dあなたの応答にはプロパティがありません。

解析しようとしないでください。jQuery はそれを行います。

これを行うだけです：

jsonList = msg.Table

AJAX 呼び出しから一番下のコードに移行している場所がわかりませんが、その間に何が起こっているのかわかりません。

これらは、JSON が解析されていないことを示唆しています。

console.log("Obj " + categoryJson); //shows the Json string 
console.log("TABLE " + categoryJson.Table); //returns undefined :(

だからここであなたはそれをする必要があります$.parseJSON。繰り返しますが、2 つのコード例の間には何の関係もありません。

于 2012-05-08T21:44:46.967 に答える
0

jquery.each を使用して JavaScript オブジェクトを反復処理できます。

html

<select id="fillme"></select>​

JavaScript

var categoryJson = {"Table":[{ "categoryid":"0","categoryname": "--Select Category1--             
"},{"categoryid":"2","categoryname":"subname2"},
{"categoryid":"3","categoryname":"subname3"},
{"categoryid":"4","categoryname":"subname4"}]};

var table = categoryJson.Table;

$(table).each(function(key,cat){
    var option = '<option value="'+cat.categoryid+'">'+cat.categoryname+'</option>';
    $('#fillme').append(option);
});

jquery の例 このコードの機能

于 2012-05-08T22:01:16.490 に答える
0

msg.d ではなく msg.Table を呼び出す必要があるようです... msg.d は未定義のようです。

于 2012-05-08T21:46:46.920 に答える