在ShieldUI Lite Grid上进行分组

Question

我正在使用从here下载的ShieldUI Lite Grid。我使用远程数据绑定并尝试在Grid上对它们进行分组，但它无法正常工作。

这是我的代码

<link href="~/Scripts/dist/css/light/all.min.css" rel="stylesheet" />
<script type="text/javascript" src="https://code.jquery.com/jquery-1.12.4.min.js"></script>
<script src="~/Scripts/dist/js/shieldui-lite-all.min.js"></script>

<div id="grid"></div>

$(function () {
    $("#grid").shieldGrid({
        dataSource: {
            remote: {
                read: {
                    url: "https://demos.shieldui.com/api/northwind/Orders?$inlinecount=allpages",
                    operations: ["sort", "skip", "take"],
                    data: function (params) {
                        var odataParams = {};
                        if (params.sort && params.sort.length) {
                            odataParams["$orderby"] = window.orderFields[params.sort[0].path].path + (params.sort[0].desc ? " desc" : "");
                        }
                        if (params.skip != null) {
                            odataParams["$skip"] = params.skip;
                        }
                        if (params.take != null) {
                            odataParams["$top"] = params.take;
                        }
                        return odataParams;
                    }
                }
            },
            schema: {
                data: "value",
                total: function (result) {
                    return result["odata.count"];
                },
                fields: window.orderFields = {
                    "OrderID": { path: "OrderID" },
                    "ShipName": { path: "ShipName" },
                    "OrderDate": { path: "OrderDate", type: "date" },
                    "ShipCity": { path: "ShipCity" },
                    "ShipCountry": { path: "ShipCountry" }
                }
            }
        },
        sorting: {
            multiple: true
        },
        paging: {
            pageSize: 8,
            pageLinksCount: 10
        },
        //grouping: [
        //    { field: "ShipCountry", order: "desc" },

        //],
        grouping: {
            field: "ShipCountry", order: "desc",
            showGroupHeader: true,
            allowDragToGroup: true,
            message: "Drag a column header here to group by a column"
        },
        columns: [
            { field: "OrderID", title: "ID", width: 80 },
            { field: "ShipName", title: "Customer", width: 180 },
            { field: "OrderDate", title: "Date", format: "{0:d}", width: 100 },
            { field: "ShipCity", title: "City", width: 160 },
            { field: "ShipCountry", title: "Country", width: 160 }
        ]
    });
});

我的代码有什么问题？或者使用远程数据时分组不起作用

由于