input - jQuery multiple value filter on table -
i'm trying filter table multiple keywords, if tr
contain keywords, display. found work great on ul
, behave strangly on table. here jsfiddle : http://jsfiddle.net/atknw/81/
the filter seems check second or third td
of each tr
. i'm missing ? use hand.
$("#kwd_search").keyup(function () { var filter = $(this).val().tolowercase(), count = 0; var length = $(this).val().length; if (length > 1) { var filter_tags = filter.split(" "); $("#dep td").each(function () { var $this = $(this); var matches = true; $.each(filter_tags, function (i, a_filter) { if ($this.text().tolowercase().indexof(a_filter) === -1) { matches = false; } }); if (matches) { $this.parent("tr").removeclass("hidden"); } else { $this.parent("tr").addclass("hidden"); } }); } else { $("#dep td").parent("tr").removeclass("hidden"); } });
working demo http://jsfiddle.net/cse_tushar/e9btu/1
your code bug after traversing td
change match value false.
i.e. if last value matches code runs fine.
i changed code run code each tr
n td
contained in , replaced code default matches=0
when match found matches=1
.
after traversing td
in 1 tr
if matches=1
remove class hidden
added filter_tags_length
calculate length of filter tags.
after traversing td
in 1 tr
sets matches=1
if filter_tags_length
equal variable c
.
$("#kwd_search").keyup(function () { var filter = $.trim($(this).val().tolowercase()); count = 0; var length = $.trim($(this).val().length); if (length > 1) { var filter_tags = filter.split(" "); var filter_tags_length = filter_tags.length; $("#dep tr:gt(0)").each(function () { count++; = 0; matches = 0; c = 0; $(this).find('td').each(function () { var $this = $(this); var lenght_td = $this.parents('tr').find('td').length; i++; $.each(filter_tags, function (i, a_filter) { if ($this.text().tolowercase().indexof(a_filter) !== -1) { c++; if (c == filter_tags_length) { matches = 1; } } }); // console.log(matches); if (i == lenght_td) { if (matches > 0) { $(this).parents("tr").removeclass("hidden"); } else { $(this).parents("tr").addclass("hidden"); } } }); //console.log('next'+count); }); } else { $("#dep td").parent("tr").removeclass("hidden"); } });
Comments
Post a Comment