使用jquery ajax填充的下拉列表在提交按钮单击后未显示

时间:2014-05-20 12:49:43

标签: c# jquery asp.net ajax

我使用jquery ajax来填充dropdownlist。每件事都运行正常,但是当我点击提交按钮时,填充的下拉列表会被清除,什么也没有显示。

可能是什么问题?

我写的代码如下:

 $("#locationList").change(function () {
             FillCashSafe();
         })

 function FillCashSafe() {
         $("#CashSafeLists").empty();
         var locationNo = document.getElementById('<%=locationList.ClientID%>').value;               
         $.ajax({
             url: "HealthReport.aspx/GetCashsafes",
             data: '{Location: "' + locationNo+ '"}',
             type: "POST",
             dataType: "json",
             contentType: "application/json; charset=utf-8",
             success: function (data) {
                 var optionhtml = '<option value="-1">Select One</option>';                     
                 if (data) {                        
                     $("#CashSafeLists").append(optionhtml)
                     $("#CashSafeLists").trigger("liszt:updated");
                     $.each(data.d, function (key, value) {
                         $("#CashSafeLists").append($("<option></option>").val(value.CashsafeId).html(value.CashsafeSerialNo));
                         $("#CashSafeLists").trigger("liszt:updated");
                     });                         
                 }
                 else {                        
                     $("#CashSafeLists").append(optionhtml)
                     $("#CashSafeLists").trigger("liszt:updated");
                 }                     
             },
             error: function (result) {                    
                 $("#CashSafeLists").append($("<option></option>").val("-1").html("Select one"));
                 $("#CashSafeLists").trigger("liszt:updated");
             }
         });

按钮点击如下

<input type="submit" id="Submit1" name="btnSearch" value="Search"
class="btn btn-primary btn-Addbutton " style="margin-left: 4px;" runat="server"   
onserverclick="SearchButtonClicked"  />

2 个答案:

答案 0 :(得分:1)

提交表单后,您的页面会刷新,清除您添加到列表中的选项。您必须确保列表是基于每个页面加载构建的。

实现这一目标的一个简单技巧是在DOM准备好之后触发列表上的change事件并且您已经分配了处理程序:

$(function() {
    $("#locationList").change(function () {
        FillCashSafe();
    }).change(); // <-- added this!
});

答案 1 :(得分:0)

在服务器端,您需要使用Request.Form名称值集合来访问下拉列表的选定值。假设您的下拉列表中有IDdropdown1,并且您正在使用asp.net网络表单。然后,您可以使用以下方法进行访问。

string value = Request.Form[dropdown1.UniqueID];