javascript 无法单击 jquery 对话框中的 asp.net 按钮
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/18729306/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Cannot click on an asp.net button within a jquery dialog
提问by CodeNinja
I already did search online, and try a few solutions provided, but none of them are working for me.
我已经在网上搜索过，并尝试了一些提供的解决方案，但没有一个对我有用。
I have a button within a div. I am displaying the div within a jquery dialog. The button click doesnt work within the jquery dialog.
我在 div 中有一个按钮。我在 jquery 对话框中显示 div。按钮单击在 jquery 对话框中不起作用。
I have my code below :
我的代码如下：
aspx
aspx
<div id='one'>
<asp:LinkButton ID="ConfigureAlerts" OnClick="btnConfigureAlerts_Click" runat="server">Configure Alerts</asp:LinkButton>
</div>
<div id="ViewModalPopupDiv2">
<asp:UpdatePanel ID="UpdatePanel3" runat="server">
<ContentTemplate>
<asp:Panel ID="Panel2" runat="server" HorizontalAlign="left" ScrollBars="Auto">
<asp:Button ID="btnGetLogs" runat="server" Text="SendAlerts" OnClick="btnSendAlertEmail_Click"/>
</asp:Panel>
</ContentTemplate>
</asp:UpdatePanel>
</div>
jquery
查询
function ViewModelPopup2() {
$("#ViewModalPopupDiv2").dialog({
scrollable: true,
width: 800,
modal: true
});
}
aspx.cs
aspx.cs
protected void btnSendAlertEmail_Click(object sender, EventArgs e)
{
// Code to send email
}
protected void btnConfigureAlerts_Click(object sender, EventArgs e)
{
ScriptManager.RegisterStartupScript
(this, this.GetType(), "callScriptFunction", "ViewModelPopup2();", true);
}
}
Please let me know what I need to do , to trigger the server control events .
请让我知道我需要做什么来触发服务器控制事件。
回答by Guilherme de Jesus Santos
I also had this problem with asp.net buttons and jQuery UI Dialog.
To solve it you need to set in your aspnet button the tag UseSubmitBehaviorto false.
我也有这个问题与 asp.net 按钮和 jQuery UI 对话框。要解决此问题，您需要在 aspnet 按钮中将标签设置UseSubmitBehavior为false.
If UseSubmitBehaviorattribute is set to true(this is the default value), the button will use the browser's submit mechanism (and jQuery Dialog UI is manipulating it), if UseSubmitBehavioris set to false, the button will use a client-side script that asp.net framework includes in the page to post to the form.
如果UseSubmitBehavior属性设置为true（这是默认值），按钮将使用浏览器的提交机制（并且 jQuery Dialog UI 正在操作它），如果UseSubmitBehavior设置为false，按钮将使用客户端脚本 asp. net 框架包含在页面中以发布到表单。
So your HTML should be like this :
所以你的 HTML 应该是这样的：
<div id='one'>
<asp:LinkButton ID="ConfigureAlerts" OnClick="btnConfigureAlerts_Click" runat="server">Configure Alerts</asp:LinkButton>
</div>
<div id="ViewModalPopupDiv2">
<asp:UpdatePanel ID="UpdatePanel3" runat="server">
<ContentTemplate>
<asp:Panel ID="Panel2" runat="server" HorizontalAlign="left" ScrollBars="Auto">
<asp:Button ID="btnGetLogs" runat="server" Text="SendAlerts" OnClick="btnSendAlertEmail_Click" UseSubmitBehavior="false" />
</asp:Panel>
</ContentTemplate>
</asp:UpdatePanel>
</div>
More details at http://msdn.microsoft.com/library/system.web.ui.webcontrols.button.usesubmitbehavior.aspx
更多详细信息，请访问http://msdn.microsoft.com/library/system.web.ui.webcontrols.button.usesubmitbehavior.aspx
回答by TombMedia
This is the classic, thanks for moving my dialog jQuery, question.
这是经典，感谢您移动我的对话框 jQuery，问题。
jQuery UI for some reason moves your dialog code to the bottom of the html markup, outside of your form tag. You need to move the dialog back into the form with some more jQuery:
jQuery UI 出于某种原因将您的对话框代码移动到 html 标记的底部，在您的表单标记之外。您需要使用更多 jQuery 将对话框移回表单中：
dlg.parent().appendTo(jQuery('form:first'));
dlg.parent().appendTo(jQuery('form:first'));
where dlg is your jQuery.UI dialog object.
其中 dlg 是您的 jQuery.UI 对话框对象。
var dlg = $("#ViewModalPopupDiv2").dialog({
scrollable: true,
width: 800,
modal: true
});
dlg.parent().appendTo(jQuery('form:first'));
That should get things working for you again. Cheers!
那应该会让事情再次为你工作。干杯!
If that doesn't work, try doing that in the open event:
如果这不起作用，请尝试在 open 事件中执行此操作：
open: function(type,data) { $(this).parent().appendTo("form"); }
open: function(type,data) { $(this).parent().appendTo("form"); }
