Dropdownlist SelectedIndexChanged 事件不会在 jQuery ui-Dialog 内触发答案

【问题标题】：Dropdownlist SelectedIndexChanged event do not trigger inside jQuery ui-DialogDropdownlist SelectedIndexChanged 事件不会在 jQuery ui-Dialog 内触发
【发布时间】：2014-03-11 13:46:09
【问题描述】：

我在 jQuery ui-Dialog 中有一个带有 SelectedIndexChanged 事件的 Dropdownlist，但是当我在 DropdownList，虽然我已经将 AutopostBack 设置为 true，但没有触发 SelectedIndexChanged 事件，请问是什么原因造成的？有什么想法吗？

这是我的示例代码：

 $(document).ready(function () {

            init();

            Sys.WebForms.PageRequestManager.getInstance().add_endRequest(EndRequestHandler);

            function EndRequestHandler(sender, args) {
                init();

            }
        });

javascript函数：

function init() {

            $(".dialog-form").dialog({
                autoOpen: false,
                modal: true,
                draggable: false,
                width: 1000,
                height: 600,
                close: function () {

                    $('body').css('overflow', 'auto');
                    $(".dialog-form").dialog("close");
                }
            }).parent().appendTo("form1");

            $(".add_ppmp").click(function () {
                $(".dialog-form").dialog("open");
                $('body').css('overflow', 'hidden');
            });
}

aspx代码：

  <div class="dialog-form" title="Item">
            <div class="formholderborder">
                <div class="subadetail">
                <div class="listtable" style="margin-right: 15px;">
                    <asp:DropDownList ID="DropDownList1" runat="server" OnInit="LoadItems"  AutoPostBack="true" OnSelectedIndexChanged="cmbItem_SelectedIndexChanged"></asp:DropDownList>
                </div>
                </div>
            </div>
        </div>

【问题讨论】：

如果您展示您的代码，我们将有更好的机会帮助您。可能会发生一些不同的事情。
@Humpy 我已经用代码更新了我的帖子。
@monkeydluffy - 你能检查你的控制台看看你是否有任何错误（特别是未定义的错误）？

标签： jquery asp.net drop-down-menu selectedindexchanged

【解决方案1】：

我会更一般地解释这一点，以帮助未来的谷歌员工。

如果你查看页面的来源，你可能会直接拍脑门说“当然！”

当您使用 jQuery UI 创建对话框时，您创建对话框的元素来自 <form> 并进入 <body> 元素的根。这就是 jQuery UI 对话框的工作原理。

.aspx 页面后面的代码依赖于表单，表单外的任何内容都无法触发回发，因此任何依赖于表单外元素的事件都不会运行后面的代码。

谢天谢地，解决这个问题非常简单:)。创建对话框后，只需将其附加到<form>。

您在代码中尝试这样做是正确的，但是您使用的选择器 $("form1") 正在寻找 <form1> 类型元素 - 它不存在。

您可以使用以下代码修复它：.parent().appendTo("form");，但为了确保您只获得第一个表单元素，您可以使用 .parent().appendTo("form:first");。

如果form1 是您要附加到的表单元素的ID，那么您当然会使用$("#form1")。

【讨论】：

【解决方案2】：

    function init() {

            $(".dialog-form").dialog({
                autoOpen: false,
                modal: true,
                draggable: false,
                width: 1000,
                height: 600,
                close: function () {

                    $('body').css('overflow', 'auto');
                    $(".dialog-form").dialog("close");
                }
            }).parent().appendTo($("form:first"));

            $(".add_ppmp").click(function () {
                $(".dialog-form").dialog("open");
                $('body').css('overflow', 'hidden');
            });
}

附加 jquery ui 对话框以形成如上所示。

【讨论】：