Bind Json Data To Dropdown List с помощью Ajax Call

Question

Я разрабатываю приложение для Windows Phone 7 с использованием телефонного разрыва.

В моем проекте Я использую веб-службу для привязки данных к выпадающему списку.

мой 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); 
      }); 

Мой веб-сервис формат Возврат данных:

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

Моя проблема заключается в:

Если веб-служба возвращает данные, это не является проблемой. Проблема не связана. Это быстро связывается. Но если данные Json Return являются данными большого размера 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); 
}