Client side paging for single JSON GET call

[Jay]

How do I enable client side paging for the following code?

    $("#grid").kendoGrid({
        dataSource: {
            type: "json",
            transport: {
                read: {
                    url: "Home/GetWorklist",
                    dataType: "json",
                    type: "GET",
                    contentType: "application/json; charset=utf-8"
                }
             }
        }
});

[Jay]

Anyone?

[Alexander Valchev]

Hi Jay,

In order to enable client side paging, you have to define:

• the pageSize property of the dataSource
• the total property of the schema, because it is used by the pager to render the pages
• the pageable property of the grid

For example:

$("#grid").kendoGrid({
    dataSource: {
        type: "json",
        transport: {
            read: {
                url: "Home/GetWorklist",
                dataType: "json",
                type: "GET",
                contentType: "application/json; charset=utf-8"
            }
        },
        pageSize: 10, //page size
        schema: {
            data: "d", //root element that contains data array
            total: "d.length" //total amount of records
        }
    },
    pageable: true, //enable paging
    columns: [/* ... */]
});

I hope this helps.

All the best,
Alexander Valchev
the Telerik team

[Jay]

Okay. I think I'm on the right track, but now NO rows are showing up on my screen. Here's my code currently:

        [HttpGet]
        public JsonResult GetWorklist()
        {
            // TODO: Pass UserId in here.
            List<Workitem> worklist = PestsLogic.GetWorklist("userId");
            return Json(new { data = worklist, total = worklist.Count }, JsonRequestBehavior.AllowGet);
        }

I also tried:

        [HttpGet]
        public JsonResult GetWorklist()
        {
            // TODO: Pass UserId in here.
            List<Workitem> worklist = PestsLogic.GetWorklist("userId");
            return Json(worklist, JsonRequestBehavior.AllowGet);
        }

Here's my html:

$("#grid").kendoGrid({
        dataSource: {
            type: "json",
            transport: {
                read: {
                    url: "Home/GetWorklist",
                    dataType: "json",
                    type: "GET",
                    contentType: "application/json; charset=1-8"
                }
            },
            pageSize: 10,
            schema: {
                data: "d", //root element that contains data array
                total: "d.length" //total amount of records
            }
        },
        pageable: true
    });

[Alexander Valchev]

Hello Jay,

I assume that the problem is caused by the fact that the root element containing data array is not correct (e.g: data: "d" ). The example from my previous post illustrates a general case and might not fit exactly to your server response. Could you please post the exact format of the Json received by the browser from the server?

Regards,
Alexander Valchev
the Telerik team

[Jay]

Here's the GET I'm currently using:

[HttpGet]
public JsonResult GetWorklist()
{
    List<Workitem> worklist = PestsLogic.GetWorklist("userId");
    return Json(new { data = worklist, total = worklist.Count }, JsonRequestBehavior.AllowGet);
}

Here's the JSON (5 rows):

{"data":[{"CustomerEstimateKey":668,"PartNumber":"\u003ca href=\u0027/subpage/668\u0027\u003e314T4010-6A\u003c/a\u003e","Noun":"INLET","ProcurementCode":"680 ","CageCode":"81205","Responsible":"LB","SonicQueue":"Undefined","SonicStatus":"Not complete","Priority":"0","Dis":1.88,"Qis":"12124000314T4010-6A1","Status":"New","Estimator":"Undefined","RelatedParts":0},{"CustomerEstimateKey":107,"PartNumber":"\u003ca href=\u0027/subpage/107\u0027\u003e162T1113-5\u003c/a\u003e","Noun":"CYL AY","ProcurementCode":"UP1 ","CageCode":"81205","Responsible":"LB","SonicQueue":"Undefined","SonicStatus":"Not complete","Priority":"0","Dis":1.88,"Qis":"12063211162T1113-51","Status":"New","Estimator":"Undefined","RelatedParts":0},{"CustomerEstimateKey":338,"PartNumber":"\u003ca href=\u0027/subpage/338\u0027\u003e3929378-9\u003c/a\u003e","Noun":"ESCUTCHN","ProcurementCode":"SF1 ","CageCode":"88277","Responsible":"LB","SonicQueue":"Undefined","SonicStatus":"Not complete","Priority":"0","Dis":1.88,"Qis":"121006103929378-91","Status":"New","Estimator":"Undefined","RelatedParts":0},{"CustomerEstimateKey":676,"PartNumber":"\u003ca href=\u0027/subpage/676\u0027\u003e4912515-519N\u003c/a\u003e","Noun":"CLIP","ProcurementCode":"    ","CageCode":"88277","Responsible":"LB","SonicQueue":"Undefined","SonicStatus":"Not complete","Priority":"0","Dis":1.88,"Qis":"121242024912515-519N1","Status":"New","Estimator":"Undefined","RelatedParts":0},{"CustomerEstimateKey":363,"PartNumber":"\u003ca href=\u0027/subpage/363\u0027\u003e5910085U43\u003c/a\u003e","Noun":"SEAL","ProcurementCode":"SF1 ","CageCode":"88277","Responsible":"LB","SonicQueue":"Undefined","SonicStatus":"Not complete","Priority":"0","Dis":1.88,"Qis":"121050595910085U431","Status":"New","Estimator":"Undefined","RelatedParts":0}],"total":5}

[Jay]

I get it!!! After looking at my own JSON, it clicked (in my head)! Now it's working!

Thanks!!!
Jay