对 Kendo 网格列/数据源进行多重排序 - 动态设置排序

Question

我想要完成的是当用户对 kendo 网格中的列进行排序时应用 "automatic" 辅助列排序。

所以在 this JS fiddle example 中，如果用户按 "Value" 排序，它也会按 "Name" 排序。请注意，0 是一起排序的，但名称不是按字母顺序排列的。我希望它们按字母顺序排列（次要排序）。

Here's an attempt 覆盖数据源排序以完成此操作。我采用了用户的原始排序并在 "SortedName" 上添加了一个额外的排序。根据记录的排序数组，它似乎很接近但仍然无法正常工作。

关于如何完成此操作还有其他想法吗？

注意：我不想让用户按多列排序。我正在使用它的真实世界示例最多可以有 50 多列（不幸的是），因此多重排序可能会让人感到困惑/不直观。我希望它在幕后完成，无需额外的用户交互。

覆盖 kendo 数据源 sort() 的示例代码：

dataSource.originalSort = dataSource.sort;
dataSource.sort = function () {
    // take the user's sort and apply sorting on an additional column
    // the sort array should look like this:
    [
        { field: "Value", dir: "asc" }, // this is what the user sorted by
        { field: "SortedName", dir: "asc" }, // and I'm adding this
    ]
    return dataSource.originalSort.apply(this, arguments);
}

Answer 1

请尝试使用以下代码片段。

<div id="grid">
    </div>
    <script>
        var dataSource = new kendo.data.DataSource({
            data: [
                { Name: "Lisa", Value: 1 },
                { Name: "Dan", Value: 12 },
                { Name: "Ken", Value: 5 },
                { Name: "Arthur", Value: 15 },
                { Name: "Bob", Value: 0 },
                { Name: "Sally", Value: 0 },
                { Name: "Alexis", Value: 0 },
                { Name: "Cody", Value: 0 },
                { Name: "Steve", Value: 0 },
                { Name: "Andrew", Value: 0 },
                { Name: "Duke", Value: 0 }
            ],
            schema: {
                model: {
                    fields: {
                        Name: { type: "string" },
                        Value: { type: "number" }
                    }
                }
            }
        });

        $("#grid").kendoGrid({
            dataSource: dataSource,
            dataBound: function (e) {
                var isSortedByName = false;
                var grid = $("#grid").data("kendoGrid");
                var ds = grid.dataSource;
                var sort = ds.sort();
                if (sort) {
                    for (var i = 0; i < sort.length; i++) {
                        if (sort[i].field == "Name") {
                            isSortedByName = true;
                        }
                    }
                    if (isSortedByName == false) {

                        sort.push({ field: "Name", dir: "asc" });
                        ds.sort(sort);
                    }
                }
            },
            columns: [
                { field: "Name" },
                { field: "Value" }
            ],
            sortable: true
        });
    </script>

对 Kendo 网格列/数据源进行多重排序 - 动态设置排序

Multiple sort on Kendo Grid columns / DataSource - set sorting dynamically

kendo-ui

telerik

kendo-grid

telerik-grid

kendo-datasource