关于asp.net:Dropdownlist SelectedIndexChanged事件不会在jQuery UI对话框内触发


Dropdownlist SelectedIndexChanged event do not trigger inside jQuery ui-Dialog

我在jQuery ui-Dialog中有一个带有SelectedIndexChanged事件的Dropdownlist，但是当我在DropdownList中选择一个项目时，尽管我已经将AutopostBack设置为true，但没有触发SelectedIndexChanged事件，这可能是由这个问题引起的吗？有什么主意吗？

这是我的示例代码：

1
2
3
4
5
6
7
8
9
10
11
 $(document).ready(function () {

            init();

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

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

            }
        });

javascript函数：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
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代码：

1
                    </asp:DropDownList>
相关讨论

我将更笼统地解释这一点，以帮助未来的Google员工。

如果您查看页面的源代码，则可以立即拍打额头并说"当然！"

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

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

对此的修复非常简单：)。创建对话框后，只需将其附加到<form>。

您正确地尝试在代码中执行此操作，但是您使用过的$("form1")选择器正在寻找<form1>类型的元素-该元素不存在。

您可以使用以下代码进行修复：.parent().appendTo("form");，尽管要确保仅获取第一个表单元素，您可以使用.parent().appendTo("form:first");。

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

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
    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对话框追加到上面的表单中。