не може да се сортира с помощта на slickgrid + knockout - javascript, jquery, knockout.js, slickgrid

Успях да създам нокаут модел и да заредя slikgrid с персонализирани обвързвания. Следвах този пример в JSFIddle: http://jsfiddle.net/joybroto/bwSmy/4/

Но не мога да добавя сортиране към колоните. Чрез документацията за slickgrid трябва да добавя sortable: true към колони. Направих го.

Също документация (https://github.com/mleibman/SlickGrid/wiki/Getting-Started) казва, че сортирането трябва да се постигне чрез "чрез слушане на метода onSort":

slickgrid.onSort.subscribe(function(e, args){ // args: sort information.
var field = args.sortCol.field;

rows.sort(function(a, b){
var result =
a[field] > b[field] ? 1 :
a[field] < b[field] ? -1 :
0;

return args.sortAsc ? result : -result;
});

slickgrid.invalidate();
});

Не разбирам на 100% как се правят нокаут персонализирани обвързвания с slickgrid. Така че не мога да разбера как да се абонирам за onSort, използвайки нокаут част.

Отговори:

Разбрах. Трябва да запазите препратка към настройките си за данни отделно и да сортирате по тях, вместо тези вътре в параметъра args.

И така, с помощта на много добри отговори тук (Актуализиране на SlickGrid с Knockoutjs чрез dependObservable) и този (https://github.com/mleibman/SlickGrid/blob/gh-pages/examples/example-multi-column-sort.html). Базира се на сортиране в няколко колони:

var grid;
var gridData;
ko.bindingHandlers.slickGrid = {
init: function (element, valueAccessor) {
var settings = valueAccessor();
gridData = ko.toJS(settings.data); // instead of ko.utils.unwrapObservable(settings.data) since within my ObservableArray there are Observables.
var columns = ko.utils.unwrapObservable(settings.columns);
var options = ko.utils.unwrapObservable(settings.options) || {};
grid = new Slick.Grid(element, gridData, columns, options);

grid.onSort.subscribe(function (e, args) {
var cols = args.sortCols;

gridData.sort(function (dataRow1, dataRow2) {
for (var i = 0, l = cols.length; i < l; i++) {
var field = cols[i].sortCol.field;
var sign = cols[i].sortAsc ? 1 : -1;
var value1 = dataRow1[field], value2 = dataRow2[field];
var result = (value1 == value2 ? 0 : (value1 > value2 ? 1 : -1)) * sign;
if (result != 0) {
return result;
}
}
return 0;
});
grid.invalidate();
});
},
update: function (element, valueAccessor, allBindingAccessor, viewModel) {
var settings = valueAccessor();
gridData = ko.toJS(settings.data); //just for subscription
grid.setData(gridData, false);
grid.resizeCanvas(); // NB Very important for when a scrollbar appears
grid.render();
}

};

Не е 100% красиво, но работи.