Filtering Table rows using Jquery
There's no need to build an array. You can address the DOM directly.
Try :
rows.hide();
$.each(data, function(i, v){
rows.filter(":contains('" + v + "')").show();
});
DEMO
EDIT
To discover the qualifying rows without displaying them immediately, then pass them to a function :
$("#searchInput").keyup(function() {
var rows = $("#fbody").find("tr").hide();
var data = this.value.split(" ");
var _rows = $();//an empty jQuery collection
$.each(data, function(i, v) {
_rows.add(rows.filter(":contains('" + v + "')");
});
myFunction(_rows);
});
UPDATED DEMO
Have a look at this jsfiddle.
The idea is to filter rows with function which will loop through words.
jo.filter(function (i, v) {
var $t = $(this);
for (var d = 0; d < data.length; ++d) {
if ($t.is(":contains('" + data[d] + "')")) {
return true;
}
}
return false;
})
//show the rows that match.
.show();
EDIT: Note that case insensitive filtering cannot be achieved using :contains()
selector but luckily there's text()
function so filter string should be uppercased and condition changed to if ($t.text().toUpperCase().indexOf(data[d]) > -1)
. Look at this jsfiddle.