tags:

views:

14

answers:

1

When the Page_Load event gets called to load the page, how would I have the page load already scrolled to a particular id. I cannot use a named anchor # because it breaks my css.

I can use javascript's scrollto function but i don't know how to call javascript from the asp.net page_load event.

I have several headers, and a menu that sorts the contents within each header. So each header has a sort menu. When I sort say Header 2 by "Oldest" I reload the page and change the orderby stuff in my sql and repopulate the repeater under each header. On load I would like the page to load already scrolled to Header 2. I would normally just use #Header2 on the redirect, but I can't use the this anchor method because it breaks my code.

Is there any neat method to accomplish this?

The css issue has to do with full length columns and having a border in the gutter. I know I can use images, but the nature of my pages would require the css to be dynamic to account for the different widths and apply the appropriate background image.

A: 

I ended up setting the <body> tag to runat="server" and assigning an id="body". I then added this code in the Page_Load event:

 if (Request.QueryString["view"] != null && Request.QueryString["view"] != "")
 {
      body.Attributes["onload"] = "scroll('" + Request.QueryString["view"] + "');";
 }
 else //Probably redundant, but I have partial postbacks
 {
      body.Attributes.Remove("onload");
 }

It calls this JS function:

function scroll(id)
{
    var a = document.getElementById(id);
    if (a != null) {
        window.scrollTo(0, a.offsetTop);
    }
}

So instead of using #header2, I use a querystring of view=header2 because I have to do a postback anyway. If I just want to go to a named anchor I use onclick="scroll('header2')" in the link.

Mark