Заполнение SelectList из базы данных

Я совершенно не знаком с использованием данных JSON и ajax, но у меня есть список выбора, который я хочу заполнить из веб-службы. Я использовал скрипач, чтобы убедиться, что веб-служба корректно возвращает данные JSON, и я подтвердил, что это так. SelectList только отображения по умолчанию ----Select-----Заполнение SelectList из базы данных

код веб-сервиса:

[WebService(Namespace = "http://tempuri.org/")] 
[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)] 
[ToolboxItem(false)] 

[ScriptService] 
public class WebService1 : System.Web.Services.WebService 
{ 
    private TrackerEntities db = new TrackerEntities(); 


    [WebMethod] 
    [ScriptMethod(ResponseFormat = ResponseFormat.Json)] 
    public string GetCompanies() 
    { 
     var companies = new List<Company>(); 
     companies = (from c in db.Ref_Company 
        select new Company { CompanyDesc = c.CompanyDesc,CompanyCode = c.CompanyCode }).ToList(); 
     return new JavaScriptSerializer().Serialize(companies); 
    } 


} 

public class Company 
{ 
    public string CompanyCode { get; set; } 
    public string CompanyDesc { get; set; } 
}

Код для HTML

<html xmlns="http://www.w3.org/1999/xhtml"> 
<head runat="server"> 
<title></title> 
<script src="Scripts/jquery-1.4.1.js" type="text/javascript"></script> 
<script type="text/javascript"> 
$(document).ready(function() { 
    $.ajax({ 
     type: "POST", 
     contentType: "application/json; charset=utf-8", 
     data: "{}", 
     url: "WebService1.asmx/GetCompanies", 
     dataType: "json", 
     success: ajaxSucceess, 
     error: ajaxError 
    }); 
    function ajaxSucceess(data) { 
     $.each(data, function (index, elem) { 
      // Create a new <option>, set its text and value, and append it to the <select> 
      $("<option />") 
       .text(elem.CompanyCode) 
       .val(elem.CompanyDesc) 
       .appendTo("#Select1"); 
     }); 
    } 

    function ajaxError(response) { 
     alert(response.status + ' ' + response.statusText); 
    } 
}); 


</script> 
</head> 
<body> 
<form id="form1" runat="server"> 


<select id="Select1"><option>---Select------</option></select> 


</form> 
</body> 
</html>

источник

2013-09-16 Steven Ackley

Является 'ajaxSuccess()' вызывается? Выполняет ли он повторение возвращаемых значений? Когда вы отлаживаете это, в какой момент это происходит? – David

Он не работает, когда работает функция ajaxSuccess, добавляет пустую запись под --- Select ----. Извините, я довольно новичок в ajax –

Вы можете отлаживать код JavaScript в средствах отладки браузера, таких как инструменты разработчика Firebug или Chrome. Когда вы говорите, что это не работает в функции 'ajaxError', какое указание на этот провал? Вы имеете в виду, что 'alert()' в этой функции выполняется? Если сам вызов AJAX терпит неудачу, вам нужно будет проверить инструменты отладки вашего браузера, чтобы определить ответ, возвращаемый с сервера. Этот ответ может содержать полезное сообщение об ошибке или другое указание сбоя на стороне сервера, не связанного с кодом JavaScript. – David

На основании вышеизложенных замечаний, я думаю, что проблема в том, что вы не получаете доступ к массиву должным образом. Учитывая этот JSON ответ:

{ "d" : "[ 
    { "CompanyCode" : "HTH", "CompanyDesc" : "Company1" }, 
    { "CompanyCode" :‌ "SMC", "CompanyDesc" : "Company2" }, 
    { "CompanyCode" : "CTT", "CompanyDesc" : "‌Company3" } 
]"}

Если это значение data в функции успеха в коде JavaScript, то вы не можете перебрать data как массив. Потому что data не является массивом, это единственный объект. Этот объект содержит массив, в свойстве под названием d. Попробуйте изменить свой призыв к $.each() использовать эту собственность вместо:

$.each(data.d, function (index, elem) { 
    //... 
});

Вы можете даже проверить его с нормальным for цикла, чтобы убедиться:

for (var i = 0; i < data.d.length; i++) { 
    // do something with data.d[i] 
}

источник

2013-09-16 16:56:55 David

Заполнение SelectList из базы данных

ответ

Смежные вопросы