使用Ajax调用将Json数据绑定到下拉列表

Question

我正在开发一个使用手机间隙的Windows Phone 7应用程序.

在我的项目中,我使用Web服务将数据绑定到下拉列表.

我的html代码将数据绑定到ID ddlcas

<tr><td>Caste </td><td><select id="ddlcas"></select></td></tr>

我的Ajax电话

$.ajax({

            type: "GET",
            contentType: "application/json; charset=utf-8",
            url: "xxxxxxxxxxxxxx",
            corssDomain: true,
            dataType: "jsonp",
            success: function (data) {

            var result = data;
            $.each(result, function (key, value) {
            var appenddata = "<option value = '" + value.ListKey + " '>" + value.ListValue + " </option>";
            $('#ddlcas').html($('#ddlcas').html() + appenddata);
             });

我的Web服务返回数据格式:

[
 {
  ListKey: "1",
  ListValue: "6000 Niyogi Brahmin"
 },
 {
  ListKey: "2",
  ListValue: "96K Kokanastha"
 },
 {
 ListKey: "3",
 ListValue: "Ad Dharmi"
 }, 
 /*upto 350 cast name */
]

我的问题是:

如果Web服务返回数据很小没有问题它快速绑定.但是如果Json返回数据是大例350到400的数据.这是让浏览器没有响应和一些警报就像停止脚本...我想知道我在哪里犯错误Plz检查并告诉...

Answer 1

不要修改循环内的标记.循环结束时更新标记.

尝试更改您的成功回调,如下所示

success: function (data) {                    
         var appenddata;
         $.each(data, function (key, value) {
             appenddata += "<option value = '" + value.ListKey + " '>" + value.ListValue + " </option>";                        
         });
        $('#ddlcas').html(appenddata);
}