在 jQuery 对话框中单击控件时，如何使我的 asp.net 页面回发？答案

【问题标题】：How can I make my asp.net page postback when a control is clicked inside a jQuery dialog?在 jQuery 对话框中单击控件时，如何使我的 asp.net 页面回发？
【发布时间】：2023-03-08 18:58:01
【问题描述】：

我在使用 jQuery UI 时遇到了一些问题。我用 jQuery UI 创建了一个对话框：到目前为止，一切都很好。我在 jQuery UI 对话框中设置了一个表单，然后就另当别论了。我写了一个非常简单的页面来说明：

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="testpage.aspx.cs"     Inherits="RiverCascade.testpage" %>
<head runat="server">    
<link rel="Stylesheet" type="text/css" href="Stylesheet1.css" />
<link rel="Stylesheet" type="text/css" href="css/smoothness/jquery-ui-1.8.5.custom.css" />
<script type="text/javascript" src="js/jquery-1.4.2.min.js"></script>
<script type="text/javascript" src="js/jquery-ui-1.8.5.custom.min.js"></script>
<script type="text/javascript">
function showModal() {
    $("#modalBox").dialog();
}
$(document).ready(showModal);    
</script>
</head>
<body>
<form id="form1" runat="server">
    <div>    
    <asp:Button runat="server" ID="button1" OnClick="button1_click" />                
        <div style="display:none" id="modalBox">
        <asp:Button runat="server" ID="button2" OnClick="button2_click" />        
        </div>

    </div>
    </form>
</body>
</html>

在上面的代码中，看到我刚刚导入了 jQuery、jQuery UI 和样式表，并设置了一个带有对话框的页面。对话框外面有一个asp控件button1，对话框里面有一个asp控件button2。

当我点击 button1 时，事件处理程序被调用并且一切正常。但是，当单击 jQuery 对话框中的按钮 button2 时，什么也没有发生。

为什么我的网页会这样？我该如何解决？

【问题讨论】：

哈哈哈，有“沮丧”的标签吗？金子。 :)

标签： jquery asp.net jquery-ui

【解决方案1】：

以下内容来自 jQuery UI 对话框source（您必须向下滚动很远）。

// ... more code here ...
uiDialog = (self.uiDialog = $('<div></div>'))
            .appendTo(document.body)
            .hide()
            .addClass(uiDialogClasses + options.dialogClass)
// ... more code here ...

基本上，您看到行为的原因是 jQuery Dialog 创建了一个新元素并将其附加到页面的body（在 ASP.NET 表单之外）。由于您的按钮现在位于 ASP.NET 表单之外，因此不会导致常规提交。

Tim B James 的解决方案应该可以掩盖问题。

【讨论】：

+1：感谢您的帮助。但是，一旦我让按钮工作，我会在对话框中添加一些文本框。你猜怎么着？我提交表格时它们都是空白的？那怎么办？
@Rice Flour Cookies：同样的原因，提交表单时，这些文本框不在表单标签内。由于它们不在表单中，因此不会提交其数据。很多人都遇到过similar 的问题。抱歉，我帮不上忙，我已经有一段时间不用处理这个问题了，也不记得最好的解决方案是什么。
为了解决文本框问题，我将在对话框之外创建一组全新的文本框，但隐藏。然后，当您在对话框中填写文本框时，它会将值推送到其他文本框中。然后提交表单时，它将具有您可以获得的值。
@Tim B James：这是一种方法，我可能会采用here 的方法，并让 jQuery UI 将对话框附加到表单而不是正文。
啊，这是一个不错的解决方案！ :)

【解决方案2】：

尝试将其添加到 button2

UseSubmitBehavior="false"

【讨论】：

上帝耶稣！！！这是迄今为止最简单的方法！！！！我整天都在绕着这个问题转！！ ++100 Tim（p/s：我对 JQuery 很陌生）