= Лучше ответ, как мой последний пост, после того, как ваши комментарии =
AFAIK, dgrid (а также dstore) не позволяет использовать пользовательскую функцию сортировки.
Образец ниже преодолевает это ограничение. Он использует OnDemandGrid, населенный dstore.
Например, столбец field1 этой сетки содержит значения от «g1» до «g20». Они не сортируются aphanumerically (сортировки по умолчанию), но численно (пользовательских сортировки на основе чисел после "г") => "g1" < "g2" < "g3" < ... < "G10" < "G11" ...
Этот обычай сортировка выполняется с помощью функции обратного вызова: comparegXX
var comparegXX = function(a, b) {
// 'compare' is a generic comparison function for values of the same type
try {
return compare(parseInt(a.value.substr(1), 10), parseInt(b.value.substr(1), 10));
}
catch(ex) { return compareMixedTypes(a, b); }
}
... и comparegXX присваивается field1 в определении столбца (sort атрибута):
field1: {
sort: comparegXX
},
Это то же самое для field2 (смешанные типы сортировки - строки и цифры - выполнено compareMixedTypes).
Если вы хотите назначить другой настраиваемый вид полю, напишите свою собственную функцию обратного вызова сравнения и добавьте ее в определение столбца поля: fieldX: {sort: myCompareFunction}.
Обратите внимание, что в хранилище не должно быть поля с именем _newPos. Это поле создается и используется функцией doSort. Он содержит новые относительные позиции строк данных после применения пользовательского сортировки - новый вид сетки основан на этом поле.
var compare = function(a, b) { return a > b ? 1 : a < b ? -1 : 0; }
// comparison functions for custom sorts
// use a.value and b.value in these functions, not directly a and b
var comparegXX = function(a, b) {
try {
return compare(parseInt(a.value.substr(1), 10), parseInt(b.value.substr(1), 10));
}
catch(ex) { return compareMixedTypes(a, b); }
}
var compareMixedTypes = function(a, b) {
var aType = typeof a.value;
return aType == typeof b.value ? compare(a.value, b.value) :
aType == "string" ? -1 : 1;
}
require(["dstore/Memory", "dgrid/OnDemandGrid", "dojo/domReady!"], function (Memory, OnDemandGrid) {
// populate the store (random values in field2)
var tbl = [];
for(var i = 1; i < 21; i++) {
var item = {id: i};
item.field1 = "g" + i;
item.field2 = (i == 1 || Math.random() < 0.2) ? "" : Math.floor(Math.random() * 10);
tbl.push(item);
}
\t
var store = new Memory({data: tbl });
var grid = new OnDemandGrid({
collection: store,
columns:
{
id: {},
field1: {
sort: comparegXX
},
field2: {
sort: compareMixedTypes
}
},
}, 'grid');
\t
var lastField = null;
var descending = null;
grid.doSort = function(e) {
// custom sort of the grid, replaces the default sort
var field = e.sort[0].property;
if(lastField == field) descending = !descending;
else {
lastField = field;
if(descending == null) descending = e.sort[0].descending;
}
var sortFunc = grid.column(field).sort;
\t \t
if(sortFunc) {
// calculate the positions of the rows based on the custom compare function,
// they are stored in the _newPos field, and then the grid is sorted on it
var tmp = [], tmp2 = {};
store.forEach(function(item, i) { tmp.push({value: item[field], pos: i}); });
tmp.sort(sortFunc);
tmp.forEach(function(item, i) { tmp2[item.pos] = i; });
store.forEach(function(item, i) { item._newPos = tmp2[i]; });
grid.set("sort", "_newPos", descending);
}
else grid.set("sort", field, descending);
\t \t
grid.updateSortArrow([{property: field, descending: descending}]);
\t \t
}
grid.on("dgrid-sort", function(e) {
grid.doSort(e);
e.preventDefault();
});
// initial sort of the grid, use this instead of grid.set("sort"...)
grid.doSort({sort: [{property: "field1", descending: false}]});
grid.startup();
});
<script>
dojoConfig = {
async: true,
packages: [
{
name: 'dgrid',
location: 'https://cdn.rawgit.com/SitePen/dgrid/v1.1.0'
},
{
name: 'dstore',
location: '//cdn.rawgit.com/SitePen/dstore/v1.1.1'
}
]
}
</script>
<script src="https://ajax.googleapis.com/ajax/libs/dojo/1.11.2/dojo/dojo.js"></script>
<link rel="stylesheet" href="https://cdn.rawgit.com/SitePen/dgrid/v1.1.0/css/dgrid.css" />
<body>
<div id="grid" style="width:300px;height:530px;">
</div>
</body>
Обеспечить пример данных, которые вы сортировочный. Вы уверены, что поля действительно пусты и что они не заполнены невидимыми символами типа «" или "\ t" или похожими? – jwpfox
вы можете создать образец или jsfiddle, где мы можем воспроизвести ту же проблему .... –
Привет, похоже, поскольку поля столбца представляют собой комбинацию пустых строк, нулей и ненулевых чисел, сортировка не работает должным образом. Как я могу сортировать по пустым полям сначала, а затем нулевые и другие числа в порядке возрастания и наоборот в порядке убывания? – nikitha