Note that there are some explanatory texts on larger screens.

plurals
  1. POASP.NET: ModalPopupExtender prevents button click event from firing
    text
    copied!<p>Here is what I'm trying to do: Click a button on my page, which in turn makes (2) things happen:</p> <ol> <li>Display a ModalPopup to prevent the user from pressing any buttons or changing values</li> <li>Call my code behind method, hiding the ModalPopup when finished</li> </ol> <p>Here is the ASP markup:</p> <pre><code>&lt;asp:UpdatePanel ID="UpdatePanel2" runat="server" ChildrenAsTriggers="true" UpdateMode="Always"&gt; &lt;Triggers&gt; &lt;asp:AsyncPostBackTrigger ControlID="btnSaveData" EventName="Click" /&gt; &lt;/Triggers&gt; &lt;ContentTemplate&gt; &lt;asp:Panel ID="pnlHidden" runat="server" style="display: none;"&gt; &lt;div&gt; &lt;h1&gt;Saving...&lt;/h1&gt; &lt;/div&gt; &lt;/asp:Panel&gt; &lt;cc1:ModalPopupExtender ID="modalPopup" BackgroundCssClass="modalBackground" runat="server" TargetControlID="btnSaveData" PopupControlID="pnlHidden" BehaviorID="ShowModal"&gt; &lt;/cc1:ModalPopupExtender&gt; &lt;asp:Button ID="btnSaveData" runat="server" Text="Save Data" OnClick="btnSaveData_Click" /&gt; &lt;/ContentTemplate&gt; &lt;/asp:UpdatePanel&gt; </code></pre> <p>Now, here is my code behind C# code:</p> <pre><code>protected void btnSaveData_Click(object sender, EventArgs e) { UpdateUserData(GetLoggedInUser()); modalPopup.Enabled = false; } </code></pre> <p>Why doesn't this work? The ModalPopup displays perfectly, but the btnSaveData_Click event NEVER fires.</p> <p><strong>UPDATE:</strong> 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. I did try using Javascript events on the client side, which at least did fire concurrently with my server-side event. This was good news, but I can't seem to find or grab a handle on the ModalPopupExtender or its BehaviorID. This doesn't work:</p> <pre><code>function showOverlay() { var popup = $find('modalPopup'); popup.show(); } </code></pre> <p>popup is ALWAYS equal to null.</p> <p><strong>FINAL UPDATE:</strong> This is my final solution for getting this to work (Take specific note of the use of OnClientClick AND OnClick):</p> <pre><code>&lt;asp:UpdatePanel ID="UpdatePanel2" runat="server" ChildrenAsTriggers="true" UpdateMode="Always"&gt; &lt;Triggers&gt; &lt;asp:AsyncPostBackTrigger ControlID="btnSaveData" EventName="Click" /&gt; &lt;/Triggers&gt; &lt;ContentTemplate&gt; &lt;asp:Panel ID="pnlHidden" runat="server" style="display: none;"&gt; &lt;div&gt; &lt;h1&gt;Saving...&lt;/h1&gt; &lt;/div&gt; &lt;/asp:Panel&gt; &lt;cc1:ModalPopupExtender ID="modalPopup" BackgroundCssClass="modalBackground" runat="server" TargetControlID="hdnField" PopupControlID="pnlHidden" BehaviorID="ShowModal"&gt; &lt;asp:HiddenField ID="hdnField" runat="server" /&gt; &lt;/cc1:ModalPopupExtender&gt; &lt;asp:Button ID="btnSaveData" runat="server" Text="Save Data" OnClientClick="showModal();" OnClick="btnSaveData_Click" /&gt; &lt;/ContentTemplate&gt; &lt;/asp:UpdatePanel&gt; </code></pre> <p>Using this Javascript function:</p> <pre><code>function showModal() { $find('ShowModal').show(); } </code></pre> <p>... And this code behind:</p> <pre><code>protected void btnSaveData_Click(object sender, EventArgs e) { UpdateUserData(GetLoggedInUser()); modalPopup.hide(); } </code></pre>
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload