Set initial Grid page so it displays page other than first page

2 posts, 0 answers
  1. Mike
    Mike avatar
    9 posts
    Member since:
    Jun 2009

    Posted 31 Jul 2013 Link to this post

    I have built an MVC Kendo Helper Grid that needs to display something other than the first page from the DataSource. I set the AutoBind to false, and ServerOperation to true. 

    I then have some javascript code which calls the page() function with the number 2, however during this call the controller still receives a  1. What am I doing wrong, or is there another way to set the initial page? Here is the code:

                    @(Html.Kendo().Grid<SF_SatAppsMVC4.Models.MD_GetUpcomingMTCEventsResult>().Name("gridUpcomingMTC")
                        .HtmlAttributes(new { @class = "clickableGrid" })
                        .AutoBind(false)
                        .DataSource(datasource => datasource
                        .Ajax()
                        .ServerOperation(true)
                        .PageSize(5)
                        .Read(read => read.Action("GetUpcomingEvents", "ControllerCenter", new { locationID = @ViewBag.locationID })))
                        .Pageable()
                        .Columns(cols =>
                        {
                            cols.Bound(p => p.eventDate).Format("{0:dd-MMM}").Title("Date");
                            cols.Bound(p => p.Presenter);
                         }))

        
    <script>
        $(function () {
            debugger;
            $('#gridUpcomingMTC').data("kendoGrid").dataSource.page(2);
        })
    </script>
  2. Dimiter Madjarov
    Admin
    Dimiter Madjarov avatar
    2153 posts

    Posted 02 Aug 2013 Link to this post

    Hello Mike,


    The reason for the issue is that on document ready, the grid is not yet bound to the data and basically it has 0 pages. So in the current implementation the page() method is called on an empty grid. As a workaround you could use the one method to bind a handler to the dataBound event, which will be executed only once and perform the paging over there.
    E.g.
    $(function () {
        var grid = $("#grid").data("kendoGrid");
        grid.one("dataBound", function () {
            this.dataSource.page(2);
        });
    });

    I wish you a great day!
     
    Regards,
    Dimiter Madjarov
    Telerik
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  3. UI for ASP.NET MVC is VS 2017 Ready
Back to Top