Hide all tables without select text
http://stackoverflow.com/questions/25371852/tablesorter-hide-multiple-tables-based-on-dropdown-select/25372692#25372692
HTML
Hide all tables NOT containing:
<select id="mysel">
<option value="go">Choose One:</option>
<option value="car">car</option>
<option value="bus">bus</option>
<option value="apple">apple</option>
<option value="joy">joy</option>
<option value="all">show all</option>
</select>
<table class='tablesorter' id='id_a'>
<thead>
<tr>
<th class="aa"><a href='league.php?lid=17'>HREF</a>
</th>
<th class='num_caption' title='Spiele'>Sp</th>
<th class='num_caption' title='Siege'>S</th>
<th class="bb">Team</th>
</tr>
<tr><td class="aa">HREF</td><td>car</td><td>bus</td><td class="bb">aa1</td></tr>
<tr><td class="aa">HREF</td><td>car</td><td>bus</td><td class="bb">aa2</td></tr>
<tr><td class="aa">HREF</td><td>car</td><td>bus</td><td class="bb">aa3</td></tr>
</thead>
</table>
<table class='tablesorter' id='id_b'>
<thead>
<tr>
<th class="aa"><a href='league.php?lid=17'>HREF</a>
</th>
<th class='num_caption' title='Spiele'>Sp</th>
<th class='num_caption' title='Siege'>S</th>
<th class="bb">Team</th>
</tr>
<tr><td class="aa">HREF</td><td>joy</td><td>joy</td><td class="bb">bb1</td></tr>
<tr><td class="aa">HREF</td><td>joy</td><td>joy</td><td class="bb">bb2</td></tr>
<tr><td class="aa">HREF</td><td>joy</td><td>joy</td><td class="bb">bb3</td></tr>
</thead>
</table>
<table class='tablesorter' id='id_c'>
<thead>
<tr>
<th class="aa"><a href='league.php?lid=17'>HREF</a>
</th>
<th class='num_caption' title='Spiele'>Sp</th>
<th class='num_caption' title='Siege'>S</th>
<th class="bb">Team</th>
</tr>
<tr><td class="aa">HREF</td><td>bus</td><td>apple</td><td class="bb">cc1</td></tr>
<tr><td class="aa">HREF</td><td>bus</td><td>apple</td><td...
CSS
table {border:1px solid grey;border-collapse:collapse;width:200px;}
table {margin:20px;}
th, td {border:1px solid grey;}
th, td {width:20px;text-align:center;}
.aa {width:50px;}
.bb {display:none;}
#id_a{background:wheat;}
#id_b{background:lavender;}
#id_c{background:paleyellow;}
#id_d{background:palegreen;}
.yell{background:yellow;}
JavaScript
/*
http://stackoverflow.com/questions/25371852/tablesorter-hide-multiple-tables-based-on-dropdown-select
*/
$('#mysel').change(function(){
$('table td').removeClass('yell'); //remove highlighting
var i = this.value;
if (i=='go') return false;
if (i=='all') {$('.tablesorter').show();$('#mysel').val('go');return false;}
$('.tablesorter').each(function(){
var tid = this.id;
var xxx = hasitem(tid, i);
//alert(xxx[0]);
if (typeof xxx[0] == 'undefined') {
$('#'+tid).hide();
}else{
$('#'+tid).show();
}
});
});
function hasitem(tbl, item){
//alert('Table = ' +tbl+ ' Item = ' +item);
$("#"+tbl+ " td").filter(function() {
return $(this).text() == item;
}).addClass('yell');
var tableRow = $("#"+tbl+ " td").filter(function() {
return $(this).text() == item;
}).closest("tr");
return tableRow;
}