Injecting JavaScript Outside an Update Panel

Question

I have an aspx page with four UpdatePanels. Incidentally, each UpdatePanel corresponds to a JQuery UI tab. What I am trying to achieve is a JQuery UI modal dialog OUTSIDE the UpdatePanels that can be called from server-side code running INSIDE any of the UpdatePanels. So, inside the first UpdatePanel is an asp:Button which runs some server-side code. When an error ocurrs, I want to be able to inject some JavaScript that will call the modal dialog to display the error message. Here is the code I am using:

Dim script As String = "showPopupMessage('{0}');"
script = String.Format(script, errorMessage)
ScriptManager.RegisterStartupScript(Me.UpdatePanelBizInfo, Me.UpdatePanelBizInfo.GetType, Guid.NewGuid.ToString, script, True)

The showPopupMessage function on the page looks like this:

function showPopupMessage(msg) {
    $('#<%=Me.LabelPopupMessage.ClientID %>').text(msg);
    $('#dialogPopupMessage').dialog('open');
}

When the code runs to inject the JavaScript, nothing happens. I am assuming it has something to do with the fact that the error ocurrs in the code running inside an UpdatePanel. Upon inspecting the resulting HTML, the JavaScript is there. What am I doing wrong?

Answer 1

Hi,

You can run javascript on the page during an asynchronous postback, but to have it execute properly you need to use the ScriptManager class to register it. Once you do that it will fire as a startup script when the update panels callback. You could have the modal window open call fire as a startup script in those cases.

Here's a very similar question where I posted some custom code (see accepted answer). It'll likely solve your issue.

http://stackoverflow.com/questions/1952817/asp-net-javascript-inside-ajax-updatepanel/1953122#1953122

If per se your modal open call is openMyModal(someParams...);, you can use the linked code as:

string scriptText = "openMyModal(someParams...);";
this.RegisterClientStartupScript("openMyModal", scriptText);