nate
nate

Reputation: 1428

How to move asp.net page to top in c#

If the end user scrolls down a page, I would like to move the page back to the top with a button click. The user clicks the button, and I do validation. The error message is at the top of the page, and the button is at the bottom of the page. If something is invalid, then I want to send the user scroll back to the top of the page so they can see the error message.

How can I do this? I don't want to use java-script, unless I have to. Is there away to do this in C# from the code behind?

I have tried this:

ScriptManager.RegisterStartupScript(Page, this.GetType(), "ScrollPage", "scrollToTop();", true);

At run time I get the error: 0x800a1391 - JavaScript runtime error: 'scrollToTop' is undefined

Upvotes: 1

Views: 29112

Answers (5)

webMac
webMac

Reputation: 203

Although you didn't want to use JavaScript, you might still consider to use the OnClientClick="" property of an Asp.Net element on the view so your business logic can still use the OnClick="" property.

<asp:LinkButton ID="LinkButton1" OnClientClick="javascript:scroll(0,0);" OnClick="btnNextPage_Click" class="generic-button" runat="server">

This just puts the scrolling back to the very top of the page. If you want to have a nice animation going with it you have to include and use a JavaScript library such as jQuery and an relating function.

Upvotes: 1

Mmm
Mmm

Reputation: 951

I could not get any of the above to work for me.

My scenario: I have a GridView embedded in a MultiView. The user clicks something on the GridView, and it switches Views to output pertaining to what was clicked. The browser would attempt to stay in the same position on the output as the row that was clicked, which would be part way down the page, or all the way down.

I tried running Javascript to scroll to the top on the click event of the button on the row. That worked.. but before it switched to the new View, where it promptly scrolled back down.

I eventually tried this, and it works. I run it after the the View is switched and the content rendered.

Page.ClientScript.RegisterStartupScript(Me.GetType, "scrollKey", "scrollTo(0, 0);", True)

I was concerned when I returned to the original View that I'd be at the top of the page of the page again, however the browser scrolls back to the original position on the GridView, which is plain awesome.

Upvotes: 0

Arindam Nayak
Arindam Nayak

Reputation: 7462

You can change code-behind to use following.

ScriptManager.RegisterStartupScript(Page, this.GetType(), "ScrollPage", "window.scroll(0,0);", true);

Here window.scroll(x,y) means, where to scroll ( x- cord, y - cord ) . I have used 0,0 to scroll to TOP.

You had used scrollToTop , to use that you need to have this function in aspx, or use mine.

For more info , refer this - http://www.w3schools.com/jsref/met_win_scrollto.asp

Update

Since OP uses updatepanel, I have one suggestion to achieve the same. Use below. I have refereed this.

<script type="text/javascript" language="javascript">
    Sys.WebForms.PageRequestManager.getInstance().add_endRequest(EndRequestHandler);
    function EndRequestHandler(sender, args)
    {
       scrollTo(0,0);
    }
</script>

Upvotes: 4

saurabh pahuja
saurabh pahuja

Reputation: 31

You can try the following in the page directive

<%@ Page MaintainScrollPositionOnPostback="false"

Or in the code behind you can write the following:

Page.MaintainScrollPositionOnPostBack = false;

and if you are having async post back than see following post:

Scroll to top of page after ASP.Net Ajax Async-Postback without JQuery

Upvotes: 3

Jeff Lee
Jeff Lee

Reputation: 35

You don't even need C# for this. You can do this with just HTML:

<button type="button" formaction="yoursite.com#top">Click me</button>

Upvotes: 1

Related Questions