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是pre-IE9的解决方法，除非你想支持pre-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) {
  ....

在 Example-4-model 中，使用了以下排序代码。

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）。
因此，如果将数字存储为数字，则无需执行任何操作。但是，如果将数字存储为文本，则需要将它们转换为数字作为比较操作的一部分。