Ajax popup causes screen to re-load using ASP.NET - asp.net

Question

I am using the code from How to create a stunning and smooth popup using jQuery. When I click the button to activate the Ajax popup, it does appear, but the page is reloading on the button click.
How do I get around this?

Answer 1

Hard to say without seeing your code, but whatever link/button you are using to launch the dialog, make sure it is returning false from its click event handler (or submit event handler on a form)

Answer 2

Is your modal wired up to an ASP.NET button? If so, this will be set to postback on a click. Perhaps wire the modal to a regular HTML button instead?

Answer 3

Most likely your button is a post back button. You might want to change that configuration so that it does not automatically post back.

Answer 4

Since I'm using an ASP.NET button control, it wanted to post back, so I created an update panel with the AsyncPostBackTrigger ControlID=[my button id].
So the code to make it all work (with loading the jQuery library) is as follows:
<form id="form1" runat="server">
<div>
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<div id="button">
<asp:Button ID="Save1" runat="server" Text="Button" onclick="Save1_Click" />
</div>
<asp:UpdatePanel ID="up1" runat="server">
<Triggers>
<asp:AsyncPostBackTrigger ControlID="Save1" />
</Triggers>
<ContentTemplate>
</ContentTemplate>
</asp:UpdatePanel>
<div id="popupContact">
<a id="popupContactClose">x</a>
<h1>Title of our cool popup, yay!</h1>
<p id="contactArea">
Here we have a simple but interesting sample of our new stuning and smooth popup. As you can see jQuery and CSS does it easy...
<br/><br/>
We can use it for popup-forms and more... just experiment!
<br/><br/>
Press ESCAPE, Click on X (right-top) or Click Out from the popup to close the popup!
<br/><br/>
</p>
</div>
<div id="backgroundPopup"></div>
</div>
</form>