jquery - Slickgrid 电子表格插件数字排序

Question

我有一个带有此过滤插件的 slickgrid:

https://github.com/danny-sg/slickgrid-spreadsheet-plugins/blob/master/ext.headerfilter.js

它具有排序功能:

filterPlugin.onCommand.subscribe(function (e, args) {
    dataView.fastSort(args.column.field, args.command === "sort-asc");

});

这对于文本过滤非常有用，但我的大部分数据都是数字。当我过滤数字 1 到 1000 时，它会排序为 1、10、100 等。

我有一个在网上找到的数字排序函数，但它只是以随机顺序混淆数字。

function NumericSorter(a, b) {
  var x = a[sortcol], y = b[sortcol];
  return sortdir * (x == y ? 0 : (x > y ? 1 : -1));
}

我认为问题是因为它被设计为与内置的 slickgrid 点击排序功能一起使用，所以我需要对其进行调整以与电子表格排序一起使用，但是我对排序功能的理解不足以做到这一点这个。

这是我到目前为止的代码:

filterPlugin.onCommand.subscribe(function (e, args) {
    dataView.fastSort(args.column.field, args.command === "sort-asc");
    //MD added
    if (args.column.field == "linenum") {
       dataView.sort(NumericSorter, args.sortAsc);
       // alert("numeric sort");
    } else {
       dataView.fastSort(args.column.field, args.command === "sort-asc");
       // alert("text sort");
    }
 });

如何实现数字排序？

Answer 1

首先请注意，fastSort 是 IE9 之前版本的解决方法，除非您想支持 IE9 之前版本，否则不需要使用。

/***
 * Provides a workaround for the extremely slow sorting in IE.
 * Does a [lexicographic] sort on a give column by temporarily overriding Object.prototype.toString
 * to return the value of that field and then doing a native Array.sort().
 */
function fastSort(field, ascending) {
  ....

在示例 4-模型中，使用了以下排序代码。

grid.onSort.subscribe(function (e, args) {
  sortdir = args.sortAsc ? 1 : -1;
  sortcol = args.sortCol.field;

  if (isIEPreVer9()) {
    // using temporary Object.prototype.toString override
    // more limited and does lexicographic sort only by default, but can be much faster

    var percentCompleteValueFn = function () {
      var val = this["percentComplete"];
      if (val < 10) {
        return "00" + val;
      } else if (val < 100) {
        return "0" + val;
      } else {
        return val;
      }
    };

    // use numeric sort of % and lexicographic for everything else
    dataView.fastSort((sortcol == "percentComplete") ? percentCompleteValueFn : sortcol, args.sortAsc);
  } else {
    // using native sort with comparer
    // preferred method but can be very slow in IE with huge datasets
    dataView.sort(comparer, args.sortAsc);
  }
});

请注意，所有花哨的逻辑(包括 sortcol 变量)都是针对 IE8 或更低版本的解决方案，而其他浏览器基本上只需要一行代码:

grid.onSort.subscribe(function (e, args) {
  dataView.sort(comparer, args.sortAsc);
});

这是比较器:

function comparer(a, b) {
  var x = a[sortcol], y = b[sortcol];
  return (x == y ? 0 : (x > y ? 1 : -1));
}

您无需担心比较器中的排序方向 - DataView 会处理这个问题。比较器是一个标准的 javascript 比较器(请参阅 here )。
因此，如果数字存储为数字，则无需执行任何操作。但是，如果数字存储为文本，则需要在比较操作中将它们转换为数字。