Фильтровать строки таблицы с помощью jquery

Я хотел бы знать, как фильтровать строки таблицы на основе значения столбца. Плагины исключены, я хотел бы выяснить, как это сделать.

Ответ 1

Ваш вопрос довольно расплывчатый, но общая идея будет примерно такой:

$("td").filter(function() {
    return $(this).text().indexOf("whatever") !== -1;
}).parent().remove();

Здесь рабочий пример. Сначала он выбирает все ячейки таблицы, затем фильтрует их на основе некоторого текста и удаляет родительский (который должен быть tr) всех оставшихся строк.

Если вам не нужны отдельные столбцы, вы можете выбрать элементы tr и избавиться от вызова до parent. Это все равно будет работать, потому что text вернет текст всех дочерних элементов выбранного tr.

Обновить на основе комментариев

Вышеупомянутое полностью удалит соответствующие строки таблицы из DOM. Если вы хотите просто скрыть их, вы можете заменить remove на hide. Если вы захотите снова сделать строки видимыми, вы можете просто сделать что-то вроде:

$("tr").show();

Что выбирает все элементы tr и показывает их (те, которые уже видимы, не будут затронуты, так что только те, которые ранее были скрыты, снова станут видимыми).

Ответ 2

Основная идея всей фильтрации таблиц состоит в том, чтобы скрыть все строки, а затем показать те, в которых содержимое <td> содержит строку поиска.

С помощью jQuery магия выполняется следующим образом:

$('tr').filter(":contains('" + searchstring + "')").show();

Но для этого нет необходимости использовать jQuery - я закодировал для него простое JS-решение. Вы можете найти здесь здесь.