Currently I'm working on filtering table using bootstrap-multiselect plugin. I'm having hard time to make it work properly. I want to show/hide table row depending on selected values in multiselect. E.g. If row has a value of Activated, then only row with activated value should be shown and others will be hidden. If I selected Activated and Deactivated then row with values Activated and Deactivated will be shown. If I selected All Selected, all row should shown. Checked my code here:
$('#custom-select').multiselect({
includeSelectAllOption: true,
onChange: function(option, checked) {
var selected = [];
$('#custom-select option:selected').each(function() {
selected.push($(this).val());
});
console.log(selected);
$.each(selected, function(i, val) {
$('#custom-table tr > td:not(:contains('+val+'))').closest('tr').hide();
$('#custom-table tr > td:contains('+val+')').closest('tr').show();
//console.log(val);
});
}
});
My current work on jsfiddle.