Как отображать только текст, не содержащий HTML, в выпадающем меню при фильтре на handsontable? - PullRequest
0 голосов
/ 28 января 2019

Как избавиться от рендеринга 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

1 Ответ

0 голосов
/ 28 января 2019

Handsontable инициализатор должен быть изменен на -:

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;
    }
  });
...