时间戳

首页 > 解决方案 > 如何使用 Tabulator 格式化标题选择的过滤器值？

javascript - 如何使用 Tabulator 格式化标题选择的过滤器值？

问题描述

这是对这个 SO question的跟进。它与使用 Tabulator 的 SELECT 标题过滤器有关。接受的答案适用于格式化列表项

{
      title: "Topic",
      field: "topic",
      width: 120,
      headerFilterPlaceholder: "-- Select --", 
      headerFilter:"select", 
      headerFilterParams: {
          values: [1.0, 1.1, 1.2],
          listItemFormatter:function(value, title){ 
              return "<b>" + title + "</b>";
          },
      }
},

但是，一旦选择，如果选择了编辑器的值（？），格式就会出现，我们得到的格式与标题一起显示，而不仅仅是标题。我们认为我们可能需要自定义编辑器来解决此问题，但不确定。我们不希望用户能够编辑表格中的值，我们只想选择选项值来显示，而不需要从 listItemFormatter 格式化 HTML。

例如，如果选择了 1.0，我们希望1.0在选择后显示在过滤器框中，而不是<b>1.0</b>. 这个 JS Fiddle是用一个例子设置的。选择一个格式化列表选项，您应该在选择后在选择框中看到格式化的值。如何删除所选值的格式？

标签： javascripttabulator

解决方案

您不能使用内置的选择编辑器执行此操作，因为它使用输入元素来显示选定的值，而输入元素只能保存文本。

要获得此功能，您需要构建一个自定义编辑器。Tabulator 的文档可带您了解如何构建自定义编辑器

您甚至可以将其基于现有的选择编辑器，您可以在此处找到代码

推荐阅读