How do I register a Javascript function to run with every postback?

Question

I have a treeview in a user control. I need to run a javascript function with every asynch postback to scroll the div it's in to the right position. I've got it working, but I think there has to be a "cleaner" way to do it. In the Page_Load function of the control, I have the following code. Is there a better way to do it?

ScriptManager.RegisterStartupScript(this.UpdatePanel1, this.GetType(), "key" + DateTime.Now.Ticks, "RestorePosition();", true);

For the benefit of anyone searching for this answer, here is what I finally did that worked. At the top of the ascx page, I have the following code:

<script type="text/javascript">
    function pageLoad(sender, args) {
        Sys.WebForms.PageRequestManager.getInstance().add_beginRequest(SavePosition);
        Sys.WebForms.PageRequestManager.getInstance().add_endRequest(RestorePosition);
    }

    function SavePosition(sender, args) {
        document.getElementById('hdnScrollSaver').value = document.getElementById('reportTreeViewdiv').scrollTop;
    } 
    function RestorePosition(sender, args) {
        document.getElementById('reportTreeViewdiv').scrollTop = document.getElementById('hdnScrollSaver').value;
    } 

</script>

And then I wrapped the treeview in a div tag as follows:

<div class="reportTreeView" id="reportTreeViewdiv">
                    <asp:TreeView ID="TreeView1" runat="server" OnTreeNodePopulate="TreeView1_TreeNodePopulate" 
                        OnSelectedNodeChanged="TreeView1_SelectedNodeChanged" PathSeparator="|" SkinID="ReportTreeView" />
                </div>

Hope this helps someone.

Answer 1

I think this is a "clean" way to do it. You're using ScriptManager the way it is supposed to be used.

If you don't like the look of that line of code, you can always refactor it out to a "Script Utility" class or something. I wouldn't, but that's just me.

Answer 2

Ajax gives you a page life cycle similar to an ASP.Net page, but on the client side. So in the pageLoad event we can wire up functions to be called on each begin request and end request.

function pageLoad(sender, args) {
  Sys.WebForms.PageRequestManager.getInstance().add_beginRequest(beginRequest);
  Sys.WebForms.PageRequestManager.getInstance().add_endRequest(endRequest);
}

function beginRequest(sender, args) {
        // begin request code - i.e. make a "processing" div visible
}

function endRequest(sender, args) {
        // we are back
        RestorePosition(); 
}

Answer 3

I think you are doing this correctly. I would get rid of the unique key though.

As per MSDN:

By identifying the script with the key, multiple server control instances can request the script block without it being emitted to the output stream twice.

Any script blocks with the same key parameter values are considered duplicates.

The key is used to prevent you from having the scripts created multiple times so you don't need it to be unique in your case.