Call a Javascript Function after UpdatePanel Postback Issue

R100 picture R100 · Mar 23, 2011 · Viewed 48.4k times · Source

I basically have in my UpdatePanel a literal that generates a javascript array based on a method in my codebehind.

I don't have an issue when it comes to loading my content on page load. But if I try and carry out a search to update my javascript array literal within my updatepanel, I found that the literal gets updated on postback after the javascript has already fired.

Here is a basic example of what I have:

<script type="text\javascript">
function BindMyFunction(itemList)
{
    //Do something
}
</script>

<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>  
<!-- Literal containing generated JS array -->
    <asp:Literal ID="ProfileJavscriptOutput" runat="server"></asp:Literal> 
    <ul id="person-search">
    <li><asp:TextBox ID="TxtFirstname" runat="server" Text=""></asp:TextBox></li>
    <!-- Update Literal onClick -->
        <li><asp:ImageButton CssClass="searchbtn" ID="ImageButton1" runat="server" OnClick="ImageButton1_Click" /></li>
    </ul>    
    <!-- Some jCarousel rendered -->
</asp:UpdatePanel>

I've been looking at the following posts:

ASP.NET - UpdatePanel and JavaScript

call javascript after updatepanel postback

But I can't seem to apply it correctly to my code.

It works fine when I don't use an UpdatePanel. But it is a requirement so that the page position does not move when searches are carried out.

Answer

Andrew Ding picture Andrew Ding · Mar 23, 2011

you can add the following code in Page_Load event:

ScriptManager.RegisterStartupScript(Me.rptGridAlbum, rptGridAlbum.GetType, "scriptname", "somejavascript", True)

This will fire the javascript on your page after the AJAX callback.

MSDN