Filter the records from the table using JQuery

$(document).ready(function(){
$(“.styled”).click(function() {
//fetch all the rows of table
var ab = $(“tr.allrooms”);
//hide all rows at first
ab.hide();
var data;
var stype;
//loop over each checked box
$(‘input:checked’).each(function() {
//fetch what to search i.e.fetch value from checkbox
data=$(this).attr(‘id’);
//The data type is for getting value of column to be searched i.e.add the data-type to checkboxes
stype=$(this).data(‘type’);
//here add the class name of column same as that of data-type added to the checkbox and display trs of table
$(“tr.allrooms td.”+stype+”:contains(‘”+data +”‘)” ).parent(‘tr’).show();
})

if($(‘input:checked’).length==0){
//if all checkboxes are unchecked after checking them,it displays all rows again
ab.show();
}

});

});

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s