在Kendo UI網格中控制組訂單

Question

有沒有辦法控制Kendo UI網格中的分組順序。有一個小組我想在所有其他小組之前去，但看起來Kendo UI網格按字母順序排列小組。我知道爲分組名稱添加一個空間是有效的，但這看起來很駭人。

感謝 利奧

Answer 1

目前沒有辦法對除該組字段以外的其他組進行排序。有一種方法可以像Telerik那樣在非Kendo網格中進行排序，這是我現在對它們最大的特性要求。所以我們現在被卡住了。

對我而言，一件破解工作就是將排序字段和顯示字段組合成一個新的字符串列，該列將隱藏範圍內的排序字段部分隱藏起來。這是在數據源端完成的（對於我來說，在SQL中）。即使排序字段是數字，新列也會被排序爲字符串，因此在某些情況下您必須適當地進行填充。

例如，如果我的數據是：

[ 
    { 
     'Name': 'Alice', 
     'Rank': 10, 
     'RankName': '<span class="myHiddenClass">10</span>Alice', 
     ... (other fields) 
    }, 
    { 
     'Name': 'Bob', 
     'Rank': 9, 
     'RankName': '<span class="myHiddenClass">09</span>Bob', 
     ... (other fields) 
    }, 
    { 
     'Name': 'Eve', 
     'Rank': 11, 
     'RankName': '<span class="myHiddenClass">11</span>Eve', 
     ... (other fields) 
    } 
    ... (Multiple Alice/Bob/Eve records) 
] 

那麼我可以通過RankName場，而不是名稱字段組。它將在組標題中顯示名稱字段，但按Rank字段排序。在這種情況下，即使愛麗絲首次按字母順序排列，鮑勃也會成爲第一組。這與您提到的空白填充類似。

Answer 2

使用列來指定列的順序，一旦你有你的數據，如

columns: [ 
{ 
field: "LastName", 
title: "Last Name" 
}, 
{ 
field: "FirstName", 
title: "First Name" 
} 
] 

Answer 3

分組時，自定義排序方向不由電網支持的 - 組是按照列的排序方式排序（當使用客戶端排序時），當沒有分組時。排序方向與JavaScript中的默認排序相同。

Answer 4

您可以添加查詢您所定義的數據源後，這似乎工作

related.query({ 
     sort: { field: "Sort", dir: "asc"}, 
     group: { field: "CategoryName" }, 
     pageSize: 50 
    }); 

在相互關聯的數據源的

Answer 5

劍道的分組由給定的排序陣列中的所有元素的名稱字段（例如fooBar），然後迭代排序的元素。概括地說，與僞代碼：

if (element[i].fooBar!= element[i-1].fooBar) { 
    StartNewGroup(element[i]); 
} else { 
    AddToLastGroup(element[i]); 
} 

由於排序後的數組，需要做的分組，它是棘手的更改排序。我創建的代碼來取代內部groupBy()功能，這讓我的分組結果，但是我喜歡排序：你的頁面加載後

function overrideKendoGroupBy() { 
    var origFunc = kendo.data.Query.prototype.groupBy; 
    kendo.data.Query.prototype.groupBy = function (descriptor) { 
     var q = origFunc.call(this, descriptor); 

     var data = SortYourData(q.data, descriptor.dir); 

     return new kendo.data.Query(data); 
    }; 
} 

呼叫overrideKendoGroupBy()在一些點。現在只需實現SortYourData()函數，其中q.data是一組分組，descriptor.dir是"asc"或"desc"。 q.data[n]有一個items數組，其中包含第n組中包含的來自原始數據源的元素。

注意：此解決方案僅適用於不使用分頁。在應用分組前，頁面會被分解，所以如果您的數據跨越多個頁面，所有投注都將關閉。

Answer 6

嘗試AddDescending和AddAscending，見下文

@(Html.Kendo().Chart<T>() 
[... other code ...] 
.DataSource(ds => ds 
    .Read(read => read.Action("action", "controller")) 
    .Group(g => g.AddDescending(model=> model.property)) // <-- subtle difference here! 
) 
[... other code ...] 
) 

http://www.telerik.com/forums/stacked-chart-legend-order

Answer 7

例子下面是一個簡單的解決方法。 之前不漂亮，但很簡單...

在文本前只需添加空格來達到期望的上述排序

[{ 
     'Value': 1, 
     'Description': 'Description 1', 
     'Grouping': 'Group 1' 
    }, 
    { 
     'Value': 2, 
     'Description': 'Description 2', 
     'Grouping': ' Group 2' 
    }, 
    { 
     'Value': 3, 
     'Description': 'Description 3', 
     'Grouping': 'Group 3' 
    }] 

在示例代碼組2出現1組因爲領先的空間。