Answers

• iecwebmast Posts: 66Questions: 9Answers: 1

  September 2016

  Hello,

  I still haven't found a solution. Can anyone help me with this?
  The accent neutralize plug works with data declared as "string", but not with html data. My data also includes html and declaring the data as a string causes the column sorting not work properly.

  STRING example:
  search for "tuv" finds all cases, regardless of accents... but "name" column sort is not functioning correctly.
  http://jsfiddle.net/lbriquet/hdq8bLqn/

  HTML example:
  search for "tuv" finds only unaccented matches.. but "name" column sort functions correctly.
  http://jsfiddle.net/lbriquet/cj2s501L/

  I need both the accent neutralize search and the column sorting to work...

  What can I do to fix this?
• iecwebmast Posts: 66Questions: 9Answers: 1

  September 2016

  Could this method be used?
  https://datatables.net/plug-ins/filtering/type-based/html

  It seems to be possible, I've got it working for one letter. How can I use it with list of multiple special characters?

  Here is my test... it works for tuv, (showing variations of "u" with or without the umlaut), but not for sol (still does not show the variations of "o" with or with the umlaut).
  https://jsfiddle.net/lbriquet/efvLfe63/
• iecwebmast Posts: 66Questions: 9Answers: 1

  September 2016 edited September 2016

  I found a solution, by adapting the Datatables strip html plugin to replace a chain of special characters in the html.

  The jQuery.fn.dataTable.ext.type.search.html method resolved the problems (see above) faced when tables contain html data that could not be resolved with the jQuery.fn.dataTable.ext.type.search.string method used in the Datatables accent neutralise plugin.

  What do you think?
  https://jsfiddle.net/lbriquet/xjzuahrt/1/

  (function() {
    var _div = document.createElement('div');
    jQuery.fn.dataTable.ext.type.search.html = function(data) {
      _div.innerHTML = data;
      return _div.textContent ?
        _div.textContent
          .replace(/[áÁàÀâÂäÄãÃåÅæÆ]/g, 'a')
          .replace(/[çÇ]/g, 'c')
          .replace(/[éÉèÈêÊëË]/g, 'e')
          .replace(/[íÍìÌîÎïÏîĩĨĬĭ]/g, 'i')
          .replace(/[ñÑ]/g, 'n')
          .replace(/[óÓòÒôÔöÖœŒ]/g, 'o')
          .replace(/[ß]/g, 's')
          .replace(/[úÚùÙûÛüÜ]/g, 'u')
          .replace(/[ýÝŷŶŸÿ]/g, 'n') :
        _div.innerText
          .replace(/[áÁàÀâÂäÄãÃåÅæÆ]/g, 'a')
          .replace(/[çÇ]/g, 'c')
          .replace(/[éÉèÈêÊëË]/g, 'e')
          .replace(/[íÍìÌîÎïÏîĩĨĬĭ]/g, 'i')
          .replace(/[ñÑ]/g, 'n')
          .replace(/[óÓòÒôÔöÖœŒ]/g, 'o')
          .replace(/[ß]/g, 's')
          .replace(/[úÚùÙûÛüÜ]/g, 'u')
          .replace(/[ýÝŷŶŸÿ]/g, 'n');
    };
  });
  
  $(document).ready(function() {
    var oTable = $('#example').DataTable({
      "columnDefs": [{
        "type": "html",
        "targets": '_all'
      }]
    });
   // Remove accented character from search input as well
      $('#example_filter input[type=search]').keyup( function () {
          var table = $('#example').DataTable(); 
          table.search(
              jQuery.fn.DataTable.ext.type.search.html(this.value)
          ).draw();
      } );
  });