0

我需要根据从 Jquery 对话框中的第一个下拉列表中选择的值更新我的第二个下拉列表从数据库中。

ASPX

<asp:UpdatePanel ID="upnl" OnLoad="upnl_Load" runat="server" UpdateMode="Conditional">
<ContentTemplate>
<div id="dv" style="display: none;" title="Tile">
<table>
    <tr>
        <td>Parent</td>
        <td>
            <asp:DropDownList ID="ddlDialog1" runat="server" /></td>
    </tr>
    <tr>
        <td>Child</td>
        <td>
            <asp:DropDownList ID="ddlDialog2" runat="server" /></td>
    </tr>
</table>
</div >
</ContentTemplate>
</asp:UpdatePanel>

jQuery

function EditBookingDialog() {
    jQuery(document).ready(function () {
        $("#dvEditBooking").dialog({
            draggable: true,
            modal: true,
            width: 500,
            height: 400
            ,
            open: function (type, data) {
                $("#<%= ddlDialog1.ClientID %>").change(function () {
                    __doPostBack('<%= upnl.ClientID %>', "DialogOnChange");
                });
            }
        });
    });
}

背后的代码

protected void upnl_Load(object sender, EventArgs e)
{
if (arg.ToString().IndexOf("DialogOnChange") > -1)
{
    // Here ddlDialog1.SelectedValue is always " ", Even I get a data set of values,ddlDialog2 is not populated with new values 
    ddlDialog2.DataSource = objMngr.GetData(ddlDialog1.SelectedValue);
    ddlDialog2.DataValueField = "Id";
    ddlDialog2.DataTextField = "name";
    ddlDialog2.DataBind();
}
 upnl.Update();
}

这里的问题是，如何在第一个下拉列表中的值更改时填充第二个下拉列表（ddlDialog2）。

任何想法？

4

1 回答 1

1

您需要添加第一个下拉列表的服务器端更改事件。修改第一个下拉列表的 html 如下。

<asp:DropDownList ID="ddlDialog1" runat="server" OnSelectedIndexChanged="upnl_Load()" />

删除 jquery 更改并手动调用 _do 回发

    $("#<%= ddlDialog1.ClientID %>").change(function () {

          $.ajax(function{
          url: "/YourPage.aspx"
          type:"POST"
          data:{"FirstDropDownValue" : $(this).val() }
          success:function(msg){
            //bind your second dropdown here.
            if(msg.d != null)
             {

      // Looping over list
        $.each(msg.d, function (index, value) {
            $("#ddlDialog1").append($("<option>   </option>").val(value["Id"]).html(value["name"]));

             });
           }

    });

更新服务器端方法如下

[WebMethod]
public static List<Myclass> void upnl_Load( string FirstDropDownValue)
{
  if (FirstDropDownValue != "-1")
  {
    return objMngr.GetData(FirstDropDownValue);
  }

  upnl.Update();
}
于 2013-09-09T06:16:04.443 回答