在Kendo Grid上的多列排序/ DataSource - 動態設置排序

Question

我試圖完成的是當用戶對kendo網格中的列進行排序時，應用「自動」輔助列排序。

因此，在this JS fiddle example中，如果用戶按「值」排序，它也會按「名稱」排序。請注意，0被排序在一起，但名稱不是按字母順序排列的。我希望他們按字母順序排列（次要排序）。

Here's an attempt覆蓋數據源排序來完成此操作。我正在接受用戶的原始排序，並在「SortedName」上添加了一個額外的排序。基於已記錄的排序數組，它似乎很接近，但仍然不起作用。

有關如何完成此任何其他想法？

注意：我不想讓用戶按多列進行排序。我使用的這個真實世界的例子可能有多達50多列（不幸的是），所以多重排序可能會令人困惑/不直觀。我希望在幕後完成，無需額外的用戶交互。用於覆蓋劍道數據源的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>