Paging to the top of the grid

[Jon]

H, guys

I have this nice piece of code that ensures that when the grid is paged it will jump back to the top of the grid. Useful for when the user is at the bottom of the grid.

<script type="text/javascript" language="javascript">
    // Catches events fired by the RadGrid (paging) and jumps page to the top
    var postbackElement;
    Sys.WebForms.PageRequestManager.getInstance().add_beginRequest(beginRequest);
    Sys.WebForms.PageRequestManager.getInstance().add_pageLoaded(pageLoaded);
    function beginRequest(sender, args) {
        postbackElement = args.get_postBackElement();
    }
    function pageLoaded(sender, args) {
        if (typeof (postbackElement) === "undefined") {
            return;
        }
        // Uses the MasterTable ClientID
        if ((postbackElement.id) === "ctl00_CphJam_ctl00_RadGrid1_ctl00") {
            window.scrollTo(0, 160);
        }
    }
</script>

However, it only works when a page 'number' is clicked - it does not work when any of the next, previous, first or last image buttons are clicked.

Does anybody know please?

Cheers,
Jon

[Angel Petrov]

Hi Jon,

I suggest that you use RadAjax and intercept the OnRequestStart client-side event. From the event arguments you can extract the UniqueID of the control which initiated the request and determine whether it is a child control of the RadGrid(e.g. a button in the pager). If this requirement is met you can scroll to the position you desire. Please review the project attached which demonstrates this approach and tell us if it meets the requirements.

All the best,
Angel Petrov
the Telerik team

[Jon]

Hi Angel,

Thank you very much for the reply.

Your demo does indeed work but my grid is a little complex. I have other events in the grid that need to keep the grid scrolled where it is and not jump to the top.

The original code I posted works great except for the paging image buttons - is there any other way the image button events could be captured the same as for the numerical paging links?

Otherwise, I'll just have to use numerical paging, which would be a shame.

Cheers,
Jon

[Angel Petrov]

Hi Jon,

The code which you previously posted works fine when ajaxification is done via RadAjax. When using regular update panels the postbackElement.id will not be set accordingly when paging via the next, previous, last or first button. In order to use the logic which you previously posted you will have to use RadAjax for ajaxification. In attachments you can find a sample project which demonstrates a possible resolution.

Kind regards,
Angel Petrov
the Telerik team

[Jon]

Hi Angel,

I just realised that I didn't explain that I am using Ajax - in fact using the proxy.
Either using the RadAjaxPanel or RadAjaxManagerProxy it gives the same result. The pager jumps back to the top as desired when clicking the numerical numbers but not when clicking the first, previous, next and last buttons.

Your first solution worked for the first, previous, next and last buttons but in my grid I also have link buttons that pop up RadNotifications that need to stay where they are (not going to the top).
I just need to isolate the pager and make only events from the pager scroll to the top.

It seems strange that the numerical pager links work but not the image buttons.
I would imaging most people would want the grid to scroll to the top when paged from the bottom of the grid, when the grid is long.

Cheers,
Jon

[Angel Petrov]

Hello Jon,

Since you are using a RadAjaxManagerProxy I suppose that you have a Master/Content page relation or you are using WebUserControls. Could you please explain in detail your scenario so we could advice you with the best possible option? As in the example I have attached in my previous post the logic uses RadAjaxPanel for ajaxification.

All the best,
Angel Petrov
the Telerik team

[Jon]

Hi Angel,

Thank you for your persistence!
It's taken me all day to unravel this one, but finally I now know what was wrong.
For anyone else as careless as me, here is what was causing the problem.

Protected Sub RadGrid1_PreRender(ByVal sender As Object, ByVal e As System.EventArgs) Handles RadGrid1.PreRender

       'used for page saving
       If Not Session("GridPage") Is Nothing Then
           RadGrid1.CurrentPageIndex = Convert.ToInt32(Session("GridPage"))
           ' THIS LINE WAS THE PROBLEM 'RadGrid1.MasterTableView.Rebind()
       End If

   End Sub

Thanks for the great support!

Jon