Call a Javascript Function after UpdatePanel Postback Issue

Question

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.

what does the code look like before and what does it look like after? — Russ Cam, Mar 23 '11 at 22:03
How is the JavaScript being called when the full page loads? — Karl Nicoll, Mar 23 '11 at 22:12
@Nick Yes I know. lol! But this is the only way I could think about doing a postback without refreshing the page in SharePoint. — R100, Mar 24 '11 at 09:58
it does refresh the page exactly like a post back, except you can't visually tell (except for the fact that responses aren't as fast as true AJAX calls). — The Muffin Man, Mar 24 '11 at 16:28

score 26 · Accepted Answer · edited Aug 20 '13 at 20:31

26

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

edited Aug 20 '13 at 20:31

Chad Schouggins

3,440
2
23
29

answered Mar 23 '11 at 22:56

Sydneyandy

286
2
2

Yep that worked I basically called the ScriptManager.RegisterStartupScript on getting the initial data and then I called that when I carried out my searches to update the Javascript. – R100 Mar 24 '11 at 09:57
20

Too bad a better explanation of the arguments wasn't given otherwise this answer would probably have way more Up votes – Serj Sagan Feb 13 '13 at 23:54
2

If you're trying to include a whole javascript file note that the 4th parameter is not the path to the file, but the actual javascript contents. You can do something like `File.ReadAllText(Server.MapPath("~/Virtual/Path/To/File.js"))` – TJB Jan 13 '14 at 23:13
1

Although this works, it seems to build up progressive script bloat in the resulting document after multiple calls. However, there's another [idea here](http://stackoverflow.com/a/456223/314291) – StuartLC Jan 16 '15 at 18:08

score 0 · Answer 2 · answered Jan 13 '16 at 13:45

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
        }
    });
};

score 0 · Answer 3 · answered Mar 23 '11 at 22:13

0

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.

answered Mar 23 '11 at 22:13

Tahbaza

9,486
2
26
39

Updating a JS array on UpdatePanel postback is probably better done using [`ScriptManager.RegisterArrayDeclaration`](https://msdn.microsoft.com/en-us/library/bb292362%28v=vs.110%29.aspx). – Abel Jun 12 '15 at 02:24

Call a Javascript Function after UpdatePanel Postback Issue

3 Answers3

Linked