Call a Javascript Function after UpdatePanel Postback Issue

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="textjavascript">
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.

Answers:

Thank you for visiting the Q&A section on Magenaut. Please note that all the answers may not help you solve the issue immediately. So please treat them as advisements. If you found the post helpful (or not), leave a comment & I’ll get back to you as soon as possible.

Method 1

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

Method 2

You could create a simple webservice method that returns the javascript array to the page whenever required and wrap the call to that webservice in a javascript method. Invoking the javascript method to refresh the array in memory on the browser side will work better than expecting the js array literal to be parsed again on UpdatePanel postbacks with any success.

Method 3

var prm = Sys.WebForms.PageRequestManager.getInstance();
if (prm != null) {
    prm.add_endRequest(function (sender, e) {
        if (sender._postBackSettings.panelsToUpdate != null) {
            DisplayCurrentTime(); // here your javascript function
        }
    });
};

All methods was sourced from stackoverflow.com or stackexchange.com, is licensed under cc by-sa 2.5, cc by-sa 3.0 and cc by-sa 4.0