Exileum
@Exileum
PHP-программист

Фильтрация данных на странице со стороны клиента?

Доброго времени суток.



Возникла необходимость создать html-таблицу на стороне клиента, используя данные, отфильтрованные согласно некоторому условию. То есть условно при загрузке страницы выводится таблица, в которой все(почти все) строки имеют значение hidden. При нажатии на кнопку, атрибут скрытия снимается у строк, которые удовлетворяют условию, заданному нажатой кнопкой. Все это происходит без перезагрузки страницы. Каждый раз тягать все данные аяксом целиком не вариант, говорю сразу. Надо именно фильтровать на стороне клиента.



Никто не встречал что-нибудь похожее на то, что я описал, ну или хотя бы способом решения не поделится? Видел похожий плагин jquery, но сейчас найти не могу (не tablesorter).
  • Вопрос задан
  • 8794 просмотра
Решения вопроса 1
Exileum
@Exileum Автор вопроса
PHP-программист
Спасибо за идею. Но сейчас вот совершенно случайно нашел нечто еще более подходящее, как мне кажется: datatables.net/release-datatables/examples/api/multi_filter_select.html — поэтому, в принципе, более ничего не требуется.
Ответ написан
Комментировать
Пригласить эксперта
Ответы на вопрос 3
DWSVad
@DWSVad
Зависит от задачи, у меня было нечто похожее, но в моем случае фильтр был только один(не помню точно, что-то вроде «добавлено в базу», " уже есть в базе", не добавлено по причине N"? где N — описание причины) так в этом случае было добавить тегу tr добавить класс некоторого статуса('added','exist','not_added_n') и потом на фильтр повешать обработчик, который сделает нужный класс видимым, остальные скроет)
Ответ написан
Комментировать
DWSVad
@DWSVad
Если же фильтров много, то наверное правильным решением будет обрабатывать содержимое ячеек и в зависимости от этого скрывать, или показывать, можно запоминать результаты однажды уже обработанных, и при повторном нажатии сразу приступать к отображению/скрыванию
Ответ написан
Комментировать
Roosso
@Roosso
Нетипичный программист
А вот ещё идея…

HTML
<table>
  <tr class="color metall">
    <td>Красный</td><td>Железо</td>
  </tr>
  <tr class="metall">
    <td>Медь</td><td>Сталь</td>
  </tr>
  <tr class="color">
    <td>Синий</td><td>Белый</td>
  </tr>
</table>


JS
$(document).ready(function() {
  $("#filtr_color").click(function() {
    $("tr").hide();
    $(".color").show();
  });
});
Ответ написан
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы