Отфильтровать таблицу по входному значению, по ключу вверх (упростить мой код) [закрыто]
У меня уже есть решение, но оно грязное и может использовать некоторые настройки. По сути, у меня есть две таблицы на странице, и каждая таблица имеет текстовое поле ввода для каждого столбца с соответствующим именем фильтра. Идея состоит в том, что пока пользователь печатает над этим столбцом, таблица фильтруется по каждой переменной. Здесь я нашел свое решение, но это только для одного поля ввода и одной таблицы. Также при очистке поля ввода очищается вся таблица. Мне нравится, что этот пример не чувствителен к регистру, но в нем есть несколько ошибок.http://www.marceble.com/2010/02/simple-jquery-table-row-filter/ Вот jsfiddle, который я собрал, но он не фильтрует должным образом.http://jsfiddle.net/anschwem/mAAvW/
Код:
<script>
$(document).ready(function() {
//Declare the custom selector 'containsIgnoreCase'.
$.expr[':'].containsIgnoreCase = function(n,i,m){
return jQuery(n).text().toUpperCase().indexOf(m[3].toUpperCase())>=0;
};
$("#searchInput").keyup(function(){
$("#fbody").find("tr").hide();
var data = this.value.split(" ");
var jo = $("#fbody").find("tr");
$.each(data, function(i, v){
//Use the new containsIgnoreCase function instead
jo = jo.filter("*:containsIgnoreCase('"+v+"')");
});
jo.show();
}).focus(function(){
this.value="";
$(this).css({"color":"black"});
$(this).unbind('focus');
}).css({"color":"#C0C0C0"});
});
</script>
HTML:
<table>
<thead>
<tr>
<td><input value="Animals"></td>
<td><input value="Numbers"></td>
</tr>
</thead>
<tbody>
<tr><td>cat</td><td>one</td></tr>
<tr><td>dog</td><td>two</td></tr>
<tr><td>cat</td><td>three</td></tr>
<tr><td>moose</td><td>four</td></tr>
<tr><td>mouse</td><td>five</td></tr>
<tr><td>dog</td><td>six</td></tr>
</tbody>
</table>