Question

我在排序包含纯文本的列以及像锚标记的html时遇到问题。排序似乎发生在存储在数据源数组中的值而不是显示的值上。包含锚标记的单元格始终排在纯文本单元格之上。

下面是一个带有示例的JSFiddle。我想要的是第三列按字母顺序对名称进行排序，无论单元格是包含锚标记还是纯文本。

{ data: 2, renderer: "html" }

我尝试在第三列上应用自定义单元格渲染器，但这没有帮助。如何解决这个问题的任何建议都将非常感谢！

Answer 1

我所做的是将以下函数添加到handsontable.full.js

  // Strip out all tags not in the allowed parameter
  function stripTags(input, allowed) {

      if (!input) {
          return "";
      } else if (!isNaN(input)) {
          return input;
      }

      // making sure the allowed arg is a string containing only tags in lowercase (<a><c>)
      allowed = (((allowed || "") + "").toLowerCase().match(/<[a-z][a-z0-9]*>/g) || []).join("");


      var tags = /<\/?([a-z][a-z0-9]*)\b[^>]*>/gi,
          commentsAndPhpTags = /<!--[\s\S]*?-->|<\?(?:php)?[\s\S]*?\?>/gi;


      return input.replace(commentsAndPhpTags, "").replace(tags, function ($0, $1) {

          return allowed.indexOf("<" + $1.toLowerCase() + ">") > -1 ? $0 : "";

      });


  };

然后我在原生的handsontable函数 this.sort 中调用了stripTags函数，它将你正在排序的内容添加到数组this.sortIndex中，如下所示：

this.sortIndex.push([i, stripTags(instance.getDataAtCell(i, this.sortColumn + colOffset), "")]);

不是100％理想，但像魅力一样工作。它删除了HTML并对遗留的内容进行了排序。

也可以在GitHub

上找到

Answer 2

不幸的是，排序插件总是会对值进行排序，而不是对显示的内容进行排序。但是，您可以实现自己的排序。在这种情况下，这是你最好的选择。

你要做的是禁用HOT中的排序，然后单击标题，就像使用HOT排序一样，触发你的排序功能。

这个应该对data对象本身起作用。确保检查单击了哪个标题，以便将其转换为索引。其余的应该是直截了当的：

使用类似data.sort(function(item1, item2) { //logic })的内容，您现在可以根据您想要的任何特征对数据数组进行排序。似乎最简单的方法是根据列索引1值进行排序，这样你就可以做到：

// item1 is a row and item2 is the row right after it
data.sort(function(item1, item2) {
    return item1[1] > item2[1] ? 1 : -1; // returning 1 makes item1 greater
}
hotInstance.render(); // remember to re-render when done

这是最简单的方法。它还为您提供了更大的灵活性。祝你好运。

使用Handsontable在同一列中使用纯文本和html排序问题

2 个答案: