Is it possible for dropdown filter of jquery tablesorter to distinguish multiple values within the same cell? -

https://mottie.github.io/tablesorter/docs/example-widget-filter-custom.html gives few examples - first name column filters cell content being filter options, while city , total have predefined options filter values.

sometimes, need use cell contents filter options because don't know possibilities use predefined options, these cell contents might contain multiple values. imagine column category lists 1 or more categories row associated to. separated comma, new line, br tag, etc. how can add dropdown filter @ top listing each separate category without having list them all? if use automatic dropdown, cell contents filter options: e.g. "loan, insurance" filter option rather 2 options - "loan" , "insurance". if these separated break tags, things start uglier.

thanks!

it sounds can use filter_selectsource option add options select in column.

you can use built-in getoptions function obtain current column values. if comma-separated, can join array using commas , re-split result (demo)

$(function() {   $('table').tablesorter({     theme: 'blue',     widgets: ['zebra', 'filter'],     widgetoptions: {       filter_selectsource: function(table, column, onlyavail) {         var array = $.tablesorter.filter.getoptions(table, column, onlyavail);         return array.join(',').split(/\s*,\s*/);       }     }   }); }); 

edit: make sure add "filter-match" class ("filter-select" too) match selected option. defaults exact matches otherwise.

---

update: if data separated using <br>'s you'll need add custom parser replace <br> comma, can use same code (demo)

the header require 2 more classes set parser , tell filter widget use parsed data:

<th class="filter-select filter-match sorter-html filter-parsed">animals</th> 

js

$(function() {    $.tablesorter.addparser({     id: 'html',     is: function() {       return false;     },     format: function(str, table, cell) {       var c = table.config,         html = cell.innerhtml;       if (html) {         // replace <br> comma         html = html.replace(/\s*<br\s*\/?>\s*/g, ',')         html = $.trim(c.ignorecase ? html.tolocalelowercase() : html);         html = c.sortlocalecompare ? $.tablesorter.replaceaccents(html) : html;       }       return html;     },     type: 'text'   });    $('table').tablesorter({     theme: 'blue',     widgets: ['zebra', 'filter'],     widgetoptions: {       filter_selectsource: function(table, column, onlyavail) {         var array = $.tablesorter.filter.getoptions(table, column, onlyavail);         return array.join(',').split(/\s*,\s*/);       }     }   }); });