使用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返回的數據是Large Example 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); 
}