使用JQUERY将JSON结果添加到下拉列表中

时间:2009-08-05 08:24:59

标签: asp.net jquery

我正在通过JQUERY的AJAX方法在我的ASP.NET应用程序中通过AJAX调用页面方法,例如。

       $.ajax({
       type: "POST",
       url: "page.aspx/GetDropDowns",
       data: "{'aId':'1'}",
       contentType: "application/json; charset=utf-8",
       dataType: "json",
       success: function(msg) {
         alert(msg.d);
       },
       error: function() {
         alert('Error getting page');
       }

我将以JSON格式返回结果,我将填充下拉列表。我可以自己做这个部分,但我想知道JQuery中是否存在用于处理JSON结果的内置魔法,或者是否有任何好的实用程序脚本用于此类事情。

2 个答案:

答案 0 :(得分:2)

很少有jQuery本身可以帮助你填充下拉列表。您只需创建HTML并将其附加到下拉列表中。

我不确定你的数据的格式是什么,所以我假设它是一个对象,其中键应该是下拉键,值应该是下拉值。

我也更喜欢使用$.post然后使用$.ajax,因为它有更清晰的结构。

$.post('page.aspx/GetDropDowns', {'aId': '1'}, function (data, status) {
    if (status === 'success') {
        var options = [];
        for (var key in data) {
            options.push('<option value="' + key + '">' + data[key] + '</option>');
        }
        $('#yourId').append(options.join(''));
    } else {
        alert('error');
    }
}, 'json');

答案 1 :(得分:1)

过去我在使用下拉菜单时使用过插件。

http://www.texotela.co.uk/code/jquery/select

请求JSON数据:

    //Get the JSON Data
    $.getJSON(url, function(json) {
       PopulateDropDownFromJson(json, "#element");
    });

然后将JSON传递给使用上面插件的函数

    function PopulateDropDownFromJson(json, element){
       $.each(json, function() {
       $(element).addOption(this[valueText], this[displayText], false);
    });

}