JSFiddle - React, Tailwind, and code Playground

by korchev

HTML

<link rel="stylesheet" href="http://cdn.kendostatic.com/2012.2.710/styles/kendo.default.min.css">
<link rel="stylesheet" href="http://cdn.kendostatic.com/2012.2.710/styles/kendo.common.min.css">
<script src="http://cdn.kendostatic.com/2012.2.710/js/kendo.all.min.js"></script>
<script src="http://cdn.kendostatic.com/2012.2.710/js/cultures/kendo.culture.en-AU.min.js"></script>
<div id="grid"></div>

JavaScript

$("#grid").kendoGrid({
    dataSource: {
        type: 'odata',
        transport: {
            read: {
                url: "/echo/json/",
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                type: "POST",
                data: {
                    json: JSON.stringify({
                        "TotalResults": 1,
                        "ReturnedResults": 1,
                        "Results": [{
                            "Country_ID": 3,
                            "Country_Code": "CN",
                            "Country_Name": "Canada",
                            "County_Desc": null}],
                        "Timestamp": "2012-11-19T10:08:49.7972036-06:00",
                        "Status": "Success"
                    })
                }
            },
            parameterMap: function(options, type) {
                var paramMap = kendo.data.transports.odata.parameterMap(options);

                delete paramMap.$inlinecount; // <-- remove inlinecount parameter.
                delete paramMap.$format; // <-- remove format parameter.
                //paramMap.$includeTotalCount= "True";
                return paramMap;
            }
        },
        success: function(e) {
            alert("Success: " + e.error);
        },
        error: function(e) {
            alert("Error: " + e.errorThrown);
        },
        change: function(e) {
            //  alert("Change");
        },
        requestStart: function(e) {
            //alert("Request Start");
        },
        schema: {
            data: function(data) {
                return data.Results; // <-- The result is just the data, it doesn't need to be unpacked.
            },
            total: function(data) {
                // return data.length; // <-- The total items count is the data length, there is no .Count to unpack.
                return data.TotalResults;

            },

            model: {
               ...