[英]ASP.NET: ModalPopupExtender prevents button click event from firing
Here is what I'm trying to do: Click a button on my page, which in turn makes (2) things happen: 这是我正在尝试做的事:点击我页面上的一个按钮,这反过来使(2)事情发生:
Here is the ASP markup: 这是ASP标记:
<asp:UpdatePanel ID="UpdatePanel2" runat="server" ChildrenAsTriggers="true"
UpdateMode="Always">
<Triggers>
<asp:AsyncPostBackTrigger ControlID="btnSaveData" EventName="Click" />
</Triggers>
<ContentTemplate>
<asp:Panel ID="pnlHidden" runat="server" style="display: none;">
<div>
<h1>Saving...</h1>
</div>
</asp:Panel>
<cc1:ModalPopupExtender ID="modalPopup"
BackgroundCssClass="modalBackground" runat="server"
TargetControlID="btnSaveData" PopupControlID="pnlHidden"
BehaviorID="ShowModal">
</cc1:ModalPopupExtender>
<asp:Button ID="btnSaveData" runat="server" Text="Save Data"
OnClick="btnSaveData_Click" />
</ContentTemplate>
</asp:UpdatePanel>
Now, here is my code behind C# code: 现在,这是我的C#代码背后的代码:
protected void btnSaveData_Click(object sender, EventArgs e)
{
UpdateUserData(GetLoggedInUser());
modalPopup.Enabled = false;
}
Why doesn't this work? 为什么这不起作用? The ModalPopup displays perfectly, but the btnSaveData_Click event NEVER fires. ModalPopup显示完美,但btnSaveData_Click事件永远不会触发。
UPDATE: The first suggestion did not work for me. 更新:第一个建议对我不起作用。 I also tried your second suggestion (insofar as it applied to me). 我也尝试了你的第二个建议(只要它适用于我)。 One minor difference on my end is that there is no button on my modal panel (pnlHidden) -- it's just a message. 我的一个小的区别是我的模态面板上没有按钮(pnlHidden) - 它只是一条消息。 I did try using Javascript events on the client side, which at least did fire concurrently with my server-side event. 我确实尝试在客户端使用Javascript事件,这至少与我的服务器端事件并发。 This was good news, but I can't seem to find or grab a handle on the ModalPopupExtender or its BehaviorID. 这是个好消息,但我似乎无法找到或获取ModalPopupExtender或其BehaviorID的句柄。 This doesn't work: 这不起作用:
function showOverlay() {
var popup = $find('modalPopup');
popup.show();
}
popup is ALWAYS equal to null. popup总是等于null。
FINAL UPDATE: This is my final solution for getting this to work (Take specific note of the use of OnClientClick AND OnClick): 最终更新:这是我的最终解决方案(请特别注意使用OnClientClick和OnClick):
<asp:UpdatePanel ID="UpdatePanel2" runat="server" ChildrenAsTriggers="true"
UpdateMode="Always">
<Triggers>
<asp:AsyncPostBackTrigger ControlID="btnSaveData" EventName="Click" />
</Triggers>
<ContentTemplate>
<asp:Panel ID="pnlHidden" runat="server" style="display: none;">
<div>
<h1>Saving...</h1>
</div>
</asp:Panel>
<cc1:ModalPopupExtender ID="modalPopup"
BackgroundCssClass="modalBackground" runat="server"
TargetControlID="hdnField" PopupControlID="pnlHidden"
BehaviorID="ShowModal">
<asp:HiddenField ID="hdnField" runat="server" />
</cc1:ModalPopupExtender>
<asp:Button ID="btnSaveData" runat="server" Text="Save Data"
OnClientClick="showModal();" OnClick="btnSaveData_Click" />
</ContentTemplate>
</asp:UpdatePanel>
Using this Javascript function: 使用这个Javascript函数:
function showModal() { $find('ShowModal').show(); }
... And this code behind: ......这个代码背后:
protected void btnSaveData_Click(object sender, EventArgs e)
{
UpdateUserData(GetLoggedInUser());
modalPopup.hide();
}
Try this. 试试这个。
Create a dummy hidden field: 创建一个虚拟隐藏字段:
<asp:HiddenField ID="hdnField" runat="server" />
Set the TargetcontrolID = "hdnField" in your Modal Popup declaration. 在Modal Popup声明中设置TargetcontrolID =“hdnField”。
In your btnSaveData_Click event, do this: 在btnSaveData_Click事件中,执行以下操作:
modalPopup.Show();
Try this. 试试这个。 It is 100% working 这是100%的工作
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<asp:Button ID="Btnshow" runat="server" Text="Show" OnClick="Btnshow_Click" />
<asp:Button ID="BtnTarget" runat="server" Text="Target" Style="display: none" />
<asp:TextBox ID="TextBox1" runat="server">
</asp:TextBox>
<input type="button" value="Get" onclick="abc()" />
<asp:ModalPopupExtender ID="ModalPopupExtender1" runat="server" TargetControlID="BtnTarget"
PopupControlID="Panel1">
</asp:ModalPopupExtender>
<asp:Panel ID="Panel1" runat="server" BackColor="Black" Width="300px" Height="300px">
<asp:UpdatePanel ID="UpdatePanel2" runat="server" ChildrenAsTriggers="false" UpdateMode="Conditional">
<ContentTemplate>
<asp:Button ID="BtnHide" runat="server" Text="Hide Button" OnClick="BtnHide_Click" />
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="BtnHide" EventName="Click" />
</Triggers>
</asp:UpdatePanel>
</asp:Panel>
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="Btnshow" EventName="Click" />
</Triggers>
</asp:UpdatePanel>
Server side code 服务器端代码
protected void Btnshow_Click(object sender, EventArgs e)
{
ModalPopupExtender1.Show();
}
protected void BtnHide_Click(object sender, EventArgs e)
{
ModalPopupExtender1.Hide();
}
From this example you can easily control panel show up depends on conditions instead of just immediately show up panel once you click button. 从这个示例中,您可以轻松控制面板显示取决于条件,而不是只需单击按钮即可立即显示面板。
<asp:Button ID="btnAdd" runat="server" OnClick="btnAdd_Click"/>
<asp:HiddenField ID="hdnField" runat="server" />
<ajaxToolkit:ModalPopupExtender runat="server"
TargetControlID="hdnField"
ID="btnAdd_ModalPopupExtender"
PopupControlID="pnlPrintName">
</ajaxToolkit:ModalPopupExtender>
<asp:Panel ID="pnlPrintName" runat="server">
.
.
</asp:Panel>
//Server side code:
protected void btnAdd_Click(object sender, EventArgs e)
{
if( dt.Rows.Count == 0 )
{
btnAdd_ModalPopupExtender.Show();
}
else
{
add();
}
}
First attempt: Try to set your ButtonID into OkControlID Tag and try again 首次尝试:尝试将ButtonID设置为OkControlID标记,然后重试
OR 要么
Second attempt: Call your event over javascript there seems to be some problems with click events 第二次尝试:通过javascript调用您的事件,点击事件似乎存在一些问题
<div>
<cc1:ModalPopupExtender PopupControlID="Panel1"
ID="ModalPopupExtender1"
runat="server" TargetControlID="LinkButton1" OkControlID="Ok"
OnOkScript="__doPostBack('Ok','')">
</cc1:ModalPopupExtender>
<asp:LinkButton ID="LinkButton1" runat="server">LinkButton</asp:LinkButton>
</div>
<asp:Panel ID="Panel1" runat="server">
<asp:Button ID="Ok" runat="server" Text="Ok" onclick="Ok_Click" />
</asp:Panel>
In code behind, you can do this: 在后面的代码中,您可以这样做:
if (true)
{
var script = @"Sys.Application.add_load(function() { $find('behavoirIDModal').show(); });";
ScriptManager.RegisterStartupScript(this, GetType(), "Show", script, true);
}
Change this 'behavoirIDModal' 改变这个'behavoirIDModal'
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.