Avba
Avba

Reputation: 15266

Kendo Ui Grid - fetching only page number of rows on the inital request

I've read several posts here and also the tutorials on Telerik website, but they are lacking - and the documentation is off. Hoping for a quick fix after hours of reading.

I'm trying to use a Kendo grid with a huge amount of rows (1M). In the examples on the site, I see that the view controller action is returning the whole data set. Fetching all of the rows is very expensive process and the data set is huge.

My question is how can I configure the grid in such a way that every subsequent callback will return the next page and the initial call will not fetch all of rows at once?

My code is similar to:

//Main controller action
    public ActionResult Index()
    {
                List<items> listItems = GetAllItems(); // very expensive call!

                return View(listItems);
    }

// my view for that action
    @(Html.Kendo().Grid(Model)
        .Name("grid")
        .Columns(columns =>
          {
              //some columns...
          })

        .Pageable(page=>page.PageSizes(true)) //Enable paging - I suspect here I can fix
         .DataSource(datasource =>datasource.Ajax().PageSize(20).Read(read => read.Action("MoreItems", "Index")).ServerOperation(true)) // tried all sorts of things here
         .Sortable()
         .Filterable()
    )


// the callbacks for the ajax
    public ActionResult MoreItems([DataSourceRequest] DataSourceRequest request)
            {
                return Json(GetAllItems().ToDataSourceResult(request));
    }
    //add some cache just to see what was holding the thing up
    [OutputCache(Duration = 3600, VaryByParam = "none")]
    private static List<items> GetAllItems()
    {
        //some code to retrieve items
    }

(from the examples it looks like the initial call is returning the complete model - and subsequent calls to the Products_Read are on the filter object. How can the initial call be filtered as well but allow for future paging - in my case I have 100k+ rows and it is impossible to do "return View(model") ) Thanks!

Upvotes: 4

Views: 12970

Answers (2)

Petur Subev
Petur Subev

Reputation: 20193

It seems that you are not familiar with the LINQ expression engine. The whole collection is never retrieved. The ToDataSourceResult method is doing exactly this - applying paging/sorting/grouping on a database level (thanks to that expression engine).

You do not have to do anything - just pass the IQueryable collection (which holds all the records) to the DataSourceResult, do not call ToList before this(or anything similar) or the magic will be broken :)

Upvotes: 2

OnaBai
OnaBai

Reputation: 40887

Seems that have not been very lucky with Kendo information... What you are looking for is called serverPaging (documentation under framework DataSource in here).

For each request your server will receive:

  • take contains the number of records to retrieve
  • skip how many records from the front of the dataset to begin reading
  • page the index of the current page of data
  • pageSize the number of records per page

You might also consider using scrollable.virtual (documentation in here where the following pages are loaded while you scroll down in the grid.

This example (http://demos.kendoui.com/web/grid/remote-data.html) uses serverPaging.

Upvotes: 5

Related Questions