Run javascript after form submission in update panel?
- by AverageJoe719
This is driving me crazy! I have read at least 5 questions on here closely related to my problem, and probably 5 or so more pages just from googling. I just don't get it.
I am trying to have a jqueryui dialog come up after a user fills out a form saying 'registration submitted' and then redirecting to another page, but I cannot for the life of me get any javascript to work, not even a single alert.
Here is my update panel:
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<asp:UpdatePanel ID="upForm" runat="server"
UpdateMode="Conditional" ChildrenAsTriggers="False">
<ContentTemplate>
'Rest of form'
<asp:Button ID="btnSubmit" runat="server" Text="Submit" />
<p>Did register Pass? <%= registrationComplete %></p>
</ContentTemplate>
</asp:UpdatePanel>
The Jquery I want to execute: (Right now this is sitting in the head of the markup, with autoOpen set to false)
<script type="text/javascript">
function pageLoad() {
$('#registerComplete').dialog({
autoOpen: true,
width: 270,
resizable: false,
modal: true,
draggable: false,
buttons: {
"Ok": function() {
window.location.href = "someUrl";
}
}
});
}
</script>
Finally my code behind: ( Commented out all the things I've tried)
Protected Sub btnSubmit_Click(ByVal sender As Object, ByVal e As EventArgs) Handles btnSubmit.Click
'Dim sbScript As New StringBuilder()'
registrationComplete = True
registrationUpdatePanel.Update()
'sbScript.Append("<script language='JavaScript' type='text/javascript'>" + ControlChars.Lf)'
'sbScript.Append("<!--" + ControlChars.Lf)'
'sbScript.Append("window.location.reload()" + ControlChars.Lf)'
'sbScript.Append("// -->" + ControlChars.Lf)'
'sbScript.Append("</")'
'sbScript.Append("script>" + ControlChars.Lf)'
'ScriptManager.RegisterClientScriptBlock(Me.Page, Me.GetType(), "AutoPostBack", sbScript.ToString(), False)'
'ClientScript.RegisterStartupScript("AutoPostBackScript", sbScript.ToString())'
'Response.Write("<script type='text/javascript'>alert('Test')</script>")'
'Response.Write("<script>windows.location.reload()</script>")'
End Sub
I've tried:
Passing variables from server to
client via inline <%= % in the
javascript block of the head tag.
Putting that same code in a script
tag inside the updatePanel.
Tried to use
RegisterClientScriptBlock and
RegisterStartUpScript
Just doing a Response.Write with the
script tag written in it.
Tried various combinations of putting
the entire jquery.dialog code in the
registerstartup script, or just
trying to change the autoOpen
property, or just calling "open" on
it.
I can't even get a simple alert to work with any of these, so I am doing something wrong but I just don't know what it is.
Here is what I know:
The Jquery is binding properly even
on async postbacks, because the div
container that is the dialog box is
always invisible, I saw a similiar
post on here stating that was causing
an issue, this isn't the case here.
Using page_load instead of
document.ready since that is supposed
to run on both async and normal
postbacks, so that isn't the issue.
The update panel is updating
correctly because <p>Did register
Pass? <%= registrationComplete
%></p> updates to true after I
submit the form.
So how can I make this work? All I want is - click submit button inside an update panel - run server side code to validate form and insert into db - if everything succeeded, have that jquery (modal) dialog pop up saying hey it worked.
