Server Side Paging in Kendo Grid?

Question

I want client side grid paging in Kendo Grid. In grid only first 50 or 100 data will be shown in first page. And when customer click next page, other 50 or 100 data will be shown. I don't want to get all data from my server. because there will be million data in database and customer doesn't want to wait service to get all data from server. when he/she click next page, other data should request from server. How can I do it?

my controller

[HttpGet]
    public JsonResult Getdata()
    {
        var reports = db.ActivityLog.OrderBy(c => c.dateTime).ToList();
        var collection = reports.Select(x => new
        {
            username = x.uName,
            location = x.locName,
                devices = x.devName
        });
        return Json(collection, JsonRequestBehavior.AllowGet);
    }

my view function handleDataFromServer() {

        $("#grid").data("kendoGrid").dataSource.read();
    }

    window.setInterval("handleDataFromServer()", 10000);

    $(document).ready(function () {
        $("#grid").kendoGrid({
            sortable: true,
            pageable: {
                input: true,
                numeric: false
            },
            selectable: "multiple",
            dataSource: {
                transport: {
                    read: "/Home/Getdata",
                    type: "json"
                }
            },
            columns: [
                            { field: "username", width: "80px" },
                            { field: "location", width: "80px" },
                            { field: "devices", width: "80px" }]
        });
    });

Answer 1

In Kendo you can do that easily. You just need to turn serverPaging: true. But as far as I can recall true is default. Anyway, need to declare it inside the dataSource as follows.

dataSource: {
    transport: {},
    pageSize: 50,
    serverPaging: true,        
},
pageable: {
    refresh: true,
    pageSizes: [25, 50, 100]
}

If serverPaging is true for every new page request Kendo will send a request to Server to fetch the next lot according to your server fetching logic. Let me know if this helps.

Answer 2

See also this github project KendoGridBinderEx which is also available as NuGet package.

Demo can be found here.

Answer 3

Follow this article which explains the serverside paging, sorting and other options with proper code and explanation.

http://blog.longle.net/2012/04/13/teleriks-html5-kendo-ui-grid-with-server-side-paging-sorting-filtering-with-mvc3-ef4-dynamic-linq/

hope this helps.