How to scroll to top position when user click next page?

[Seeker]

````

$("#grid").kendoGrid({
                dataSource: {
                    type: "odata",
                    transport: {
                        read: "https://demos.telerik.com/kendo-ui/service/Northwind.svc/Customers"
                    },
                    pageSize: 15
                },
                height:600,
                groupable: true,
                sortable: true,
                pageable: {
                    refresh: true,
                    pageSize: 15,
                    pageSizes: [15,30,50,'all'],
                    buttonCount: 5
                },
                columns: [{
                    template: "<div class='customer-photo'" +
                    "style='background-image: url(https://demos.telerik.com/kendo-ui/content/web/Customers/#:data.CustomerID#.jpg);'></div>" +
                    "<div class='customer-name'>#: ContactName #</div>",
                    field: "ContactName",
                    title: "联系人",
                    width: 210
                }, {
                    field: "ContactTitle",
                    title: "职位"
                }, {
                    field: "CompanyName",
                    title: "公司"
                }, {
                    field: "Country",
                    title: "国家",
                    width: 150
                }]
            });

```````

[Stefan]

Hello, Seeker,

The desired result can be achieved by setting the scroll to 0 on the dataBound event:

dataBound: function(e) {
  var container = e.sender.wrapper.children(".k-grid-content"); // or ".k-virtual-scrollable-wrap"
  container.scrollLeft(0);
  container.scrollTop(0); // use only if virtual scrolling is disabled
},

https://docs.telerik.com/kendo-ui/api/javascript/ui/grid/events/databound 

I made an example demonstrating this:

https://dojo.telerik.com/iFOPIlin

I hope this is helpful.

Regards,
Stefan
Progress Telerik

[Seeker]

Wow, very helpful , many thanks, Stefan , good job.

[Josiah]

 this does not work if

 

                scrollable: {
                    virtual: true
                },

[Mihaela]

Hi Josiah,

Thank you for reaching out.

This issue is a known limitation, as it is stated in the article below:

https://docs.telerik.com/kendo-ui/controls/data-management/grid/scrolling/virtual-scrolling#known-limitations

The top position of the current page couldn't be located, because the virtual scrolling relies on calculating the average row height based on already loaded data.

Let me know if you have any other queries and I would be happy to assist.

Regards, Mihaela Lukanova Progress Telerik