Register Client Script with Dynamically Loaded Control in Ajax Call

2.9k Views Asked by At

I have a page that contains a custom tab control. When you click different tabs, it does a an ajax callback. During that ajax call, the code dynamically loads a different control based on which tab was clicked, then adds it to the appropriate tab. So basically I have some code that does a switch statement, uses LoadControl(), then adds the control in.

The issue I'm having is that none of the javascript within each of those controls that gets loaded is getting registered on the page. Based on this thread:

RegisterClientScriptBlock within AJAX method call

I thought I just had to switch from using Page.ClientScript.RegisterClientScriptBlock to ScriptManager.RegisterClientScriptBlock. I did that, but still nothing. Am I misunderstanding something about the ScriptManager? I want the javascript to be registered from within the dynamically loaded control, which happens to be loaded during an AJAX call.

Thanks in advance.

2

There are 2 best solutions below

3
Xavier Poinas On

I had the same issue when loading web controls within an UpdatePanel. The problem is that the JavaScript code that is dynamically loaded into the page is not automatically parsed.

I have solved it from the information in this article

Just reuse the InlineScript control that is provided and wrap it around your <script /> tags. It will do the rest for you.

0
jdnichollsc On

When load Update panel after Postback, you need to register the scripts located in the affected area again:

<asp:ScriptManager ID="ScriptManager1" EnablePartialRendering="true" runat="server">
    <Scripts>
        <asp:ScriptReference Path="~/Resources/js/registeragain.js" />
    </Scripts>
</asp:ScriptManager>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
    <ContentTemplate>
         // AREA 
    </ContentTemplate>
</asp:UpdatePanel>

registeragain.js

Sys.Application.add_init(AppInit);
function AppInit(sender) {
    Sys.WebForms.PageRequestManager.getInstance().add_endRequest(End);
}
function End(sender, args) {
    //Aqui se vuelven a llamar los scripts necesarios despues de que carge el Update Panel    
}