使用和不使用重音数据表jquery过滤数据

时间:2017-09-19 21:10:05

标签: javascript jquery datatables

我需要输入带重音的文字。我过滤了匹配的行,包括带重音的单词和没有重音的单词。

这是我的fiddle。显然它适用于jquery.datatable的版本。

有人能帮助我吗?我希望它能像:

$(document).ready(function() {
   $('#datatable-table').DataTable();
});

我有这张桌子

enter image description here

当我用arbol过滤时只显示一行,但我有两行,“arbol”和“árbol”(带重音)。

修改

我已添加此代码,但请注意,它不适用于具有空字段的列:

jQuery.fn.DataTable.ext.type.search.string = function ( data ) {
console.log('dataaaa: ' + data);
return ! data ?
    '' :
    typeof data === 'string' ?
        data
            .replace( /έ/g, 'ε')
            .replace( /ύ/g, 'υ')
            .replace( /ό/g, 'ο')
            .replace( /ώ/g, 'ω')
            .replace( /ά/g, 'α')
            .replace( /ί/g, 'ι')
            .replace( /ή/g, 'η')
            .replace( /\n/g, ' ' )
            .replace( /[áÁ]/g, 'a' )
            .replace( /[éÉ]/g, 'e' )
            .replace( /[íÍ]/g, 'i' )
            .replace( /[óÓ]/g, 'o' )
            .replace( /[úÚ]/g, 'u' )
            .replace( /ê/g, 'e' )
            .replace( /î/g, 'i' )
            .replace( /ô/g, 'o' )
            .replace( /è/g, 'e' )
            .replace( /ï/g, 'i' )
            .replace( /ü/g, 'u' )
            .replace( /ã/g, 'a' )
            .replace( /õ/g, 'o' )
            .replace( /ç/g, 'c' )
            .replace( /ì/g, 'i' ) :
        data;
};

2 个答案:

答案 0 :(得分:0)

查看他们的API:https://datatables.net/manual/api。 也许有人提到是否支持自定义过滤器。如果没有,您也可以通过更改此功能自行完成此操作 - >

var table = $('#example').DataTable();

table.columns().flatten().each( function ( colIdx ) {
// Create the select list and search operation
var select = $('<select />')
    .appendTo(
        table.column(colIdx).footer()
    )
    .on( 'change', function () {
        table
            .column( colIdx )
            .search( $(this).val() ) <-- here
            .draw();
    } );

// Get the search data for the first column and add to the select list
table
    .column( colIdx )
    .cache( 'search' )
    .sort()
    .unique()
    .each( function ( d ) {
        select.append( $('<option value="'+d+'">'+d+'</option>') );
    } );

});

答案 1 :(得分:0)

$('#datatable-table').DataTable({
   search: { regex: true }
});

let oldInput = $('.dataTables_filter input');
let newInput = $('<input>').on('change keyup input', () => {
  let regex = textToRegex(newInput.val());
  oldInput.val(regex).trigger('input');
});
oldInput.hide().after(newInput);

function textToRegex(value) {
  return value
    .toLowerCase()
    .split('')
    .map(c => {
      if (/[-[\]{}()*+?.,\\^$|#]/.test(c)) {
        return '\\' + c;
      }
      [
        /[aàáâãäå]/, /[oòóôõöø]/, /[eèéêë]/, /[cç]/, /[dð]/,
        /[ii̇ìíîï]/, /[uùúûü]/, /[nñ]/, /[sš]/, /[yÿý]/, /[zž]/
      ].some(r => {
        if (r.test(c)) {
          c = r.source;
          return true;
        }
      });
      return c;
    })
    .join('');
}