jQuery DataTables - Accent-Insensitive Alphabetization and Searching

Question

When using jQuery DataTables is it possible to do accent-insensitive searches when using the filter? For instance, when I put the 'e' character, I'd like to search every word with 'e' or 'é', 'è'.

Something that came to mind is normalizing the strings and putting them into a separate, hidden column but that wouldn't solve the alphabetizing issue.

EDIT

I tried the following:

$.fn.dataTableExt.ofnSearch = function ( data ) {
return ! data ?
    '' :
    typeof data === 'string' ?
        data
            .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, 'c' ) :
        data;
};

JS File Gist

Answer 1

You are so close in your edit, what you have tried, except that you lack the must important thing : Defining the "scope" or sType of your filter plugin. The function is never called, right? This is because the plugin is not associated with a sType.

To get your code to work simply declare the plugin like this :

$.fn.dataTableExt.ofnSearch['string'] = function ( data ) {
return ! data ?
    '' :
    typeof data === 'string' ?
..
..
}

See this fiddle -> http://jsfiddle.net/Y5ycM/ I have turned some "Internet Explorer" columns into "Internet éxplorer", some "Opera" to "öpera" etc, Try search for ex or op.

---

See https://datatables.net/development/filtering, section "Type based column filtering " :

When you assign the sType for a column (or have it automatically detected for you by DataTables or a type detection plug-in), you will typically be using this for custom sorting, but it can also be used to provide custom filtering options. This is done by adding functions to the the object with a parameter name which matches the sType for that target column:

I guess there here is a typo or oversight in the documentation, it says

$.fn.dataTableExt.ofnSearch but should correctly be $.fn.dataTableExt.ofnSearch[sType], as the example just after clearly points out.

---

Update. Allan Jardine confirms this is a bug in 1.9.4 here :

Yup - bug in 1.9.4. 1.9.4 broke this part of the code unfortunately. It also effects the removal of HTML tags from the filter, since that was using the same mechanism. It is fixed in the 1.10 betas though.

Answer 2

jQuery v: 2.1.0
jquery.dataTables.min.js v: 1.10.7
dataTables.responsive.min.js v: 1.0.6

I used the accent neutralise plugin from here (thanks Allan Jardine):
http://www.datatables.net/plug-ins/filtering/type-based/accent-neutralise

And just made minimal adaptations for my purposes:

I made an example combining the answers in: http://jsfiddle.net/xebtyaeL/5/

jQuery.fn.DataTable.ext.type.search.string = function ( 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;
};

var tabla = jQuery('#datatable-table').dataTable( { } );
          new jQuery.fn.dataTable.Responsive( tabla );

jQuery(document).ready(function() {
      var table = jQuery('#datatable-table').DataTable();

      // Remove accented character from search input as well
      jQuery('#datatable-table_filter input').keyup( function () {
        table
          .search(
            jQuery.fn.DataTable.ext.type.search.string( this.value )
          )
          .draw();
      } );
} );