我使用Handsontable来填充我的DB数据。
我使用了3行固定的数据,但是当我单击列标题进行排序时,它会将完整的数据与固定的行一起排序。
我想要它通过保留固定行进行排序。
这是jsFiddle
这是我的代码:
hot = new Handsontable(container, {
data: data,
minSpareRows: 1,
colHeaders: true,
fixedRowsTop: 3,
columnSorting: true,
contextMenu: true
});发布于 2015-03-05 12:30:58
我通过更改handsontable.full.js "this.sort“函数来解决这个问题。
我有一个固定行,所以在开始排序之前,我拼接了第一行并将其保存在变量中。
我让原始排序运行并对数据进行排序,然后在从排序函数返回之前,我将保存的第一行添加到数据数组中。
我的解决方案:
// handsontable.full.js -- built in sort function
this.sort = function () {
var instance = this;
if (typeof instance.sortOrder == 'undefined') {
return;
}
instance.sortingEnabled = false; //this is required by translateRow plugin hook
instance.sortIndex.length = 0;
var colOffset = this.colOffset();
for (var i = 0, ilen = this.countRows() - instance.getSettings()['minSpareRows']; i < ilen; i++) {
this.sortIndex.push([i, instance.getDataAtCell(i, this.sortColumn + colOffset)]);
}
// Custom Sorting - Saving First Row
var firstRow = this.sortIndex[0];
// Remove first Row from data
this.sortIndex.shift();
/////// Original Sort Begin/////////
var colMeta = instance.getCellMeta(0, instance.sortColumn);
var sortFunction;
switch (colMeta.type) {
case 'date':
sortFunction = dateSort;
break;
default:
sortFunction = defaultSort;
}
this.sortIndex.sort(sortFunction(instance.sortOrder));
////// Original Sort END /////////
// Custom Sorting - Adding the fixed row to the TOP
this.sortIndex.unshift(firstRow);
//Append spareRows
for(var i = this.sortIndex.length; i < instance.countRows(); i++){
this.sortIndex.push([i, instance.getDataAtCell(i, this.sortColumn + colOffset)]);
}
instance.sortingEnabled = true; };发布于 2015-02-25 18:15:47
不幸的是,not附带的包含排序不允许这种行为,仅仅是因为它对数据数组进行排序,而行的冻结只是为了美观。
解决方案是对数据实现自己的排序。我有同样的任务,并通过向列标题中添加onclick事件来解决它,并让该函数进行选择性排序。
在您的示例中,该函数可以从热实例中请求属性,该属性为您提供被冻结的连续行,然后通过忽略第一个x冻结行手动对数据进行排序。实现这一点的一种方法是将子数组与大数组中的非冻结行连接起来,排序,然后组合这两个数组。
希望这能有所帮助!
发布于 2016-05-06 06:32:24
如果您希望在排序手柄表时保持列固定,请实现您自己的排序比较器,该比较器将始终保留顶部的行。在0.24版中,您可以将属性sortFunction添加到每个列中。在以前的版本中,可以使用此比较器函数手动对数据数组进行排序。下面是我创建的函数,用于始终保持顶部行的固定,这在上面链接的sortFunction中使用。检查该链接以查看有关输入参数的信息。如果希望修复更多行,则需要对其进行修改。
function comparatorFactory (compareFn) {
return function (sortOrder) {
return function (a, b) {
var aRow = a[0]
var bRow = b[0]
var aValue = a[1]
var bValue = b[1]
var modifier = sortOrder === false ? -1 : 1
if (aRow === 0) {
return -1 // Make sure first row stays first
} else if (bRow === 0) {
return 1 // Make sure first row stays first
} else if (aValue == null) {
// Make sure empty rows are always last (my preference)
return bValue == null ? 0 : 1
} else if (bValue == null) {
// Make sure empty rows are always last (my preference)
return aValue == null ? 0 : -1
} else {
// Compare two actual values using the compare function
return modifier * compareFn(aValue, bValue)
}
}
}
}使用比较列中值的函数调用这个工厂,如数字比较器、字符串比较器或任何类型的数据,它将保持顶部行的固定。
https://stackoverflow.com/questions/28718223
复制相似问题