Question

如何在过滤时摆脱下拉菜单上的呈现HTML内容？如果该单元格或整个列的单元格包含HTML数据，则当我们应用过滤器时，在下拉列表中它将显示为HTML内容，我们如何在过滤时仅显示不包含HTML内容的文本？

此小提琴包含示例（在第一列中）

var dataObj = [
    ['<a>Lorem</a>', 'ipsum', 'dolor', 'sit', '12/1/2015', 23],
    ['<a>adipiscing</a>', 'elit', 'Ut', 'imperdiet', '5/12/2015', 6],
    ['<a>Pellentesque</a>', 'vulputate', 'leo', 'semper', '10/23/2015', 26],
    ['<a>diam</a>', 'et', 'malesuada', 'libero', '12/1/2014', 98],
    ['<a>orci</a>', 'et', 'dignissim', 'hendrerit', '12/1/2016', 8.5]
  ];
  var example1 = document.getElementById('example1');

  var hot = new Handsontable(example1, {
    data: dataObj,
    columns: [
      {type: 'text', renderer: 'html'},
      {type: 'text'},
      {type: 'text'},
      {type: 'text'},
      {type: 'date', dateFormat: 'M/D/YYYY'},
      {type: 'numeric'}
    ],
    colHeaders: true,
    rowHeaders: true,
    dropdownMenu: true,
    dropdownMenu: ['filter_by_value', 'filter_action_bar'],
    filters: true
  });

FIDDLE

Answer 1

可手动设置的初始化程序应更改为-：

function firstColRenderer(instance, td, row, col, prop, value, cellProperties) {
  Handsontable.renderers.TextRenderer.apply(this, arguments);
  td.innerHTML = value.replace(/<(?:.|\n)*?>/gm, '');
}
var hot = new Handsontable(example1, {
    data: dataObj,
    columns: [
      {type: 'text', renderer: 'html'},
      {type: 'text'},
      {type: 'text'},
      {type: 'text'},
      {type: 'date', dateFormat: 'M/D/YYYY'},
      {type: 'numeric'}
    ],
    colHeaders: true,
    rowHeaders: true,
    dropdownMenu: true,
    dropdownMenu: ['filter_by_value', 'filter_action_bar'],
    filters: true,
    cells: function (row, col) {
      var cellProperties = {};
      var data = this.instance.getData();

      if (col === 0) {
        cellProperties.renderer = firstColRenderer; // uses function directly
      }
      return cellProperties;
    }
  });

如何在可手动操作的筛选器上仅显示下拉菜单中不包含HTML内容的文本？

1 个答案: