Setting initial grid page

[Andrew]

Is it possible to specify page number somewhere in HTML helper so that grid's current page will be set to this specific page after loading? (I know it could be done by JavaScript without using HTML helpers, but it would be great to be able to do it in HTML helper)

[Vladimir Iliev]

Hi Andrea,

Basically setting the initial page using the HTML helper currently is not supported, however I would suggest to set the Grid AutoBind option to false and when the document ready event occurs use the page method of the dataSource. Please check the example below:

Grid configuration:

@(Html.Kendo().Grid<Kendo.Mvc.Examples.Models.ProductViewModel>()
    .Name("Grid")
    .AutoBind(false)

Document ready function:

$(function () {
    $('#Grid').data().kendoGrid.dataSource.page(3);
})

Kind Regards,
Vladimir Iliev
the Telerik team

[Andrew]

Hi Vladimir,

thank you for your suggestion, but I'm already aware of this workaround. Unfortunately this workaround is problematic because this way Grid first loads first page (filled with data) and only after that starts loading the page specified in document ready function. So, this workaround has problem with performance (another request to server which is completely unneeded). Is there any other workarounds or any way to improve the behavior of this one?

[Vladimir Iliev]

Hi Andrea,

 

Basically the provided solution is not a workaround but it is the way the Grid works - before the first request the Grid have no information about the current Total record count - that why it sets the page to the default page.

To save the additional request you can use the DataSource Query method in the following way:

Disable AutoBind option:

@(Html.Kendo().Grid<ForeignKeyColumnDemo.Models.Order>()
    .Name("Grid")
    .AutoBind(false)

Use query method to request the data:

$(function () {
        dataSource = $('#Grid').data().kendoGrid.dataSource;
        dataSource.query({
            page: 3,
            group: dataSource.group(),
            filter: dataSource.filter(),
            sort: dataSource.sort(),
            pageSize: dataSource.pageSize()
        })
    })

Kind Regards,
Vladimir Iliev
the Telerik team

[Andrew]

Vladimir,

thank you very much for this idea, looks like it solves the performance problem. But if I'll be implementing load this way, I will need to write this request data function for every grid on our site. Is there any way to generalize this treatment (except writing our own HTML helper which is not a very easy thing to do?)

[Vladimir Iliev]

Hi Andrea,

 
Basically there is no such build-in functionality which you can use to generalize it and you should implement it using custom code depending entirely on you and on the exact setup that you have.

Kind Regards,
Vladimir Iliev
the Telerik team

[Andrew]

Thank you very much Vladimir for clarifying this matter.