在 UpdatePanel 中重新填充 Asp.Net DropDownList答案

【问题标题】：Repopulate Asp.Net DropDownList In UpdatePanel在 UpdatePanel 中重新填充 Asp.Net DropDownList
【发布时间】：2013-11-27 17:32:22
【问题描述】：

我在更新面板中重新填充下拉列表时遇到了一些麻烦。在页面加载时，我加载下拉列表：

            this.dropdownFacility.Items.Clear();
            this.dropdownFacility.DataSource = table;
            this.dropdownFacility.DataTextField = "FacilityName";
            this.dropdownFacility.DataValueField = "FacilityID";
            this.dropdownFacility.DataBind();

变量“表”是我从 SQL 数据库填充的数据表。这有效并在页面第一次加载后显示我的所有值。然后，在我的页面内部，我有一个显示的 JQuery 对话框：

        <div id="assignmentDialog" title="Process Assignment">
            <div style="margin:10px; font-size:16px; ">
                <asp:Label runat="server" Text="Select A Facility:*" Font-Bold="true" style="width:140px; display:inline-block; vertical-align:text-top; text-align:right;" />
                <asp:DropDownList runat="server" ID="dropdownFacility" />
                <asp:LinkButton runat="server" ID="linkNewFacility" Text="New" ForeColor="Blue" OnClientClick="OpenFacilityDialog();" />
            </div>
        </div>

单击链接按钮后，将显示另一个 JQuery 对话框，允许用户为设施输入数据。完成后，他们可以单击按钮提交数据：

<asp:Button runat="server" ID="NewFacility" Text="Submit" OnClick="NewFacility_Clicked" OnClientClick="return CheckFacilityData();" style="display: block; text-align:center; margin: 0 auto;" />

这就是问题发生的地方。单击按钮后，我可以看到记录已插入到表中。此外，在页面加载期间我的代码中有断点，我可以看到在我重新绑定下拉列表后，项目数增加了 1，表明新记录在那里。但是，在实际页面上，该新记录不会显示在下拉列表中。下面是我如何使用触发器定义更新面板：

<asp:UpdatePanel runat="server" ID="assignmentUpdatePanel" UpdateMode="Conditional" ChildrenAsTriggers="true">
    <Triggers>
        <asp:AsyncPostBackTrigger ControlID="NewFacility" EventName="Click" />
    </Triggers>
...

谁能看出我做错了什么？

【问题讨论】：

我们可以查看您的 NewFacility 点击事件处理程序的代码吗？
偶数处理程序中的代码只是将记录提交到数据库，并且运行良好。
经过更多测试，我发现删除了对 div 的 JQuery 对话框调用，修复了重新填充下拉列表的问题。但是，我仍然想使用对话逻辑。有没有办法解决这个问题？

标签： c# jquery asp.net updatepanel html-select

【解决方案1】：

试试这样：

<asp:DropDownList runat="server" ID="dropdownFacility" 
                 AppendDataBoundItems="True" AutoPostBack="True" />

或：

this.dropdownFacility.Items.Clear();
this.dropdownFacility.DataSource = table;
this.dropdownFacility.DataTextField = "FacilityName";
this.dropdownFacility.DataValueField = "FacilityID";
this.dropdownFacility.AppendDataBoundItems = true;
this.dropdownFacility.AutoPostBack = true;
this.dropdownFacility.DataBind();

【讨论】：

【解决方案2】：

嗯，我想通了。问题实际上是由于我正在使用带有 ASP.NET UpdatePanel 的 JQuery 对话框。 JQuery 逻辑实际上为对话框创建了一个新的 div 并将其放置在表单元素之外。为了解决这个问题，我基本上做了两件事。第一个是通过执行以下操作将对话框附加回表单：

$("#assignmentDialog").dialog(
{
    modal: true,
    hide: "explode",
    width: 450,
    autoOpen: false,
    resizable: false,
    open: function (event, ui)
    {
        $(this).parent().appendTo("form");
    },
    close: function (event, ui)
    {
        // Clear the inputs
        $("#textboxStartDate").val("");
        $("#textboxEndDate").val("");
        $("#dropdownFacility").val("");
    }
});

然后，我必须通过这样做将我的更新面板移动到对话框内：

    <div id="assignmentDialog" title="Process Assignment">
        <asp:UpdatePanel runat="server" ID="assignmentUpdatePanel" UpdateMode="Conditional" ChildrenAsTriggers="true">

【讨论】：