Changing datasource type from OData to Json

[Laksh]

I’m trying to change the datasource’s type from “OData” to “json”. The new URL is returning json data. But when I change the type from OData to json, then I see the data in grid but filters & paging doesn’t work.

So I have 31 rows, then when page loads it shows 31 as page size by default, along with configured page sizes ( ie, 5,10,15,20)

Filters does not filter on any column

In below shows the old values also. Note there is no change in grid. Im not sure what else I need to change when I move from OData to Json

 

var gridDS: kendo.data.DataSource = createGridDataSource($grid);


$grid.kendoGrid({
        dataSource: gridDS,
        autoBind: true,
        columnMenu: true,
        scrollable: true,
        sortable: true,
        reorderable: true,
        filterable: {
            extra: false,
            operators: {
                string: {
                    eq: "Is equal to",
                    neq: "Is not equal to"
                }
            }
        },
        toolbar: [
            { template: kendo.template($("#tb-inprogress-template").html()) }
        ],
        pageable: {
            refresh: true,
            pageSizes: [5, 10, 15, 20],
            buttonCount: 5
        },
        columns: [
            {
                field: "BatchID",
                hidden: true,
            },
            {
                field: "TaxYear",
                title: "Year",
                width: "74px",
                attributes: { style: "text-align: right;" },
                filterable:
                {
                    ui: taxYearFilter
                }
            },
            {
                field: "CreatedByUserName",
                title: "Uploaded By",
                filterable: { ui: createdByUserNameFilter }
            },
            {
                field: "Created",
                title: "Uploaded Date",
                format: "{0:MM/dd/yyyy}",
                filterable:
                {
                    ui: createdDateFilter
                }
            },
            {
                field: "BatchStatus",
                title: "Batch Status",
                filterable: {
                    ui: batchStatusFilter
                }
            },
            {
                field: "TotalCost",
                title: "Total Cost",
                filterable: false
            }
        ]
    });

 

function createGridDataSource(progressElem: any): kendo.data.DataSource {
        return new kendo.data.DataSource({
            type: "json", // ****** before ****** “odata”
            transport: {
                read: {
                    url: "/Import/GetSummary",  // ****** before ******  “Api/BatchSummary"
                    dataType: "json",
                    timeout: timeout
                },
            },
            requestStart: function (e: any): void {
                isGridDataSourceActivelyLoading = true;
                kendo.ui.progress(progressElem, true);
            },
            requestEnd: function (e: any): void {
                isGridDataSourceActivelyLoading = false;
                kendo.ui.progress(progressElem, false);
            },
            schema: {
                data: function (data) {
                    return data;  // ****** before ****** “data["value”]
                },
                total: function (data) {
                    return data.length  // ****** before ****** “data[“odata.count”]"
                },
                model: {
                    fields: {
                        BatchID: { type: "number" },
                        TaxYear: { type: "number" },
                        BatchStatus: { type: "string" },
                        Created: { type: "date" },
                        CreatedByUserName: { type: "string" },
                        LastModifiedForSorting: { type: "date" },
                        TotalCost: { type: "string" },
                    }
                }
            },
            pageSize: pageSize,
            serverPaging: true,
            serverFiltering: true,
            serverSorting: true,
            sort: [
                { field: "LastModifiedForSorting", dir: "desc" }
            ],
            filter: [
                { field: "TaxYear", operator: "eq", value: 2015 },
                { field: "CreatedByUserName", operator: "eq", value: “James” },
                { field: "BatchStatus", operator: "neq", value: “Active” }
            ]
        });
    }

[Alexander Popov]

Hello Laksh,

This probably happens due the use of server filtering, paging and etc, which should be correctly sent to and handled by the server. I would recommend checking the paremeterMap function or disabling the server operations.

Regards,
Alexander Popov
Telerik

 

 

[Laksh]

Thanks, I will check that​