- 1. Shuffle
- 2. Sortable
- 3. HTML5 Sortable
- 4. jQuery DataTables
- 5. jPList
- 6. Mixitup
- 7. Tiny Sort
- 8. List.js
- 9. JTPS
- 10. Columns
- 11. Quicksand
- 12. Stupid Table
- 13. Pour Over
- 14. jQuery Sortable Lists
- 15. jQuery Sort and Order Portfolio
- 16. Isotope
- 17. Dynatable
- 18. Bootstrap Dropdown
- 19. Table Sorter
- 20. WaTable
Сортировка и фильтрация очень полезны, если у вас есть определенные наборы данных, такие как таблицы или гриды, однако вы также можете использовать их для управления представлениями списка, например, для страницы портфолио. Фильтры jQuery и плагины сортировки позволяют вам контролировать порядок, размещение, разбиение по страницам и организацию элементов страницы / таблицы.
Эта статья включает в себя 20 лучших плагинов jQuery фильтрации и сортировки для разработчиков, плагины ниже имеют ряд функций и позволяют легко сортировать и фильтровать данные для ваших веб-приложений. Не стесняйтесь поделиться своими мыслями, разместив комментарий ниже.
к содержанию ↑1. Shuffle
![](https://web7.pro/wp-content/uploads/2019/01/Shuffle.js-500x247.jpeg)
Shuffle.js — это плагин jQuery для сортировки, фильтрации и размещения группы элементов. ОН быстродействующий, отзывчивый и быстрый. Ссылка
2. Sortable
![](https://web7.pro/wp-content/uploads/2019/01/jQuery-Sortable-500x247.jpeg)
jQuery Sortable — гибкий, удобный сортировочный плагин. Он позволяет сортировать элементы списка (или таблицы и т. Д.) По горизонтали и вертикали с помощью мыши. Поддерживает вложенные списки и чистые контейнеры перетаскивания. jQuery Sortable не зависит от jQuery UI и хорошо работает с Twitter Bootstrap (вы даже можете сортировать навигацию Bootstrap). Ссылка
3. HTML5 Sortable
![](https://web7.pro/wp-content/uploads/2019/01/HTML5-Sortable-500x247.jpeg)
HTML5 Sortable — это плагин jQuery для создания сортируемых списков и сеток с использованием встроенного API перетаскивания HTML5. Ссылка
4. jQuery DataTables
![](https://web7.pro/wp-content/uploads/2019/01/jquery-data-tables-500x247.jpeg)
jQuery DataTables — мощный плагин, который может сортировать, разбивать на страницы и фильтровать миллионы записей. Ссылка
5. jPList
![](https://web7.pro/wp-content/uploads/2019/01/jplist-500x247.jpeg)
jPList — гибкий плагин jQuery для сортировки, разбивки на страницы и фильтрации любой HTML-структуры. Поддерживаются источники данных: PHP + MySQL, ASP.NET + Sql Server, PHP + SQLite. Он работает с такими шаблонами JavaScript, как Handlebars, Mustache и т. Д. JPList поддерживает XML + XSLT. Работает во всех основных браузерах. Для некоммерческих, личных или открытых проектов и приложений вы можете использовать jPList бесплатно в соответствии с условиями лицензии GPL V3. Ссылка
6. Mixitup
![](https://web7.pro/wp-content/uploads/2019/01/mixitup-500x254.jpg)
MixItUp — это плагин jQuery, обеспечивающий анимированную фильтрацию и сортировку. Он отлично подходит для управления любым категоризованным или упорядоченным контентом, таким как портфолио, галереи и блоги, но также может служить мощным инструментом для привлечения пользовательского интерфейса приложения и визуализации данных. MixItUp прекрасно работает с вашими существующими HTML и CSS, что делает его отличным выбором для адаптивных макетов. В отличии от подобного рода плагинов (isotope и т.п) данный плагин решает проблему динамической высоты. Если вдруг блок у Вас планирует сменить высоту, то обязательно используйте данный плагин. Ссылка
7. Tiny Sort
![](https://web7.pro/wp-content/uploads/2019/01/TinySort-500x247.jpeg)
TinySort — это небольшой скрипт, который сортирует HTMLElements. Он сортируется по значению текста или атрибута или по одному из его потомков. Приведенные примеры должны помочь вам в этом. Ссылка
8. List.js
![](https://web7.pro/wp-content/uploads/2019/01/listjs-500x247.jpeg)
List.js — это легкий кросс-браузерный собственный JavaScript, который делает ваши простые списки HTML очень гибкими, доступными для поиска, сортируемыми и фильтруемыми. Также есть возможность добавлять, редактировать и удалять элементы с помощью простых шаблонов. Ссылка
к содержанию ↑9. JTPS
![](https://web7.pro/wp-content/uploads/2019/01/jtps-500x247.jpeg)
jTPS — это подключаемый к данным плагин jQuery, который предлагает нумерацию страниц, анимированную прокрутку страниц и интеллектуальную возможность естественной сортировки. Версия для разработки в настоящее время 15 КБ. Ссылка
10. Columns
![](https://web7.pro/wp-content/uploads/2019/01/Columns-500x247.jpeg)
Столбцы — это простой способ создания данных JSON в HTML-таблицах с возможностью сортировки, поиска и разбивки на страницы. Все, что вам нужно, это предоставить данные, а Columns сделает все остальное. Ссылка
к содержанию ↑11. Quicksand
![](https://web7.pro/wp-content/uploads/2019/01/quicksand-500x247.jpeg)
Quicksand — это плагин jQuery для переупорядочивания и фильтрации элементов с хорошей анимацией тасования. Ссылка
12. Stupid Table
![](https://web7.pro/wp-content/uploads/2019/01/stupid-table-500x247.jpeg)
Это глупо простой, нелепо легкий плагин для сортировки таблиц jQuery. Пока вы понимаете базовую сортировку JavaScript, вы можете заставить этот плагин делать все, что вам нужно. Ссылка
13. Pour Over
![](https://web7.pro/wp-content/uploads/2019/01/pourover-500x247.jpeg)
PourOver — это библиотека для простой, быстрой фильтрации и сортировки больших коллекций — например, 100 000 единиц — в браузере. Он позволяет создавать приложения и архивы для исследования данных со скоростью 60 кадров в секунду, которые не должны ждать вызова базы данных для отображения результатов запроса. Ссылка
14. jQuery Sortable Lists
![](https://web7.pro/wp-content/uploads/2019/01/jQquery-sortable-lists-500x247.jpeg)
jQuery Sortable Lists позволяет сортировать html-списки, а также создавать древовидные структуры путем перетаскивания мышью с плавным движением, функции обратного вызова isAllowed или экспорта и многое другое. Ссылка
15. jQuery Sort and Order Portfolio
![](https://web7.pro/wp-content/uploads/2019/01/jQuery-Sort-and-Order-Portfolio-Plugin-500x247.jpeg)
Плагин jQuery Sort and Order Portfolio имеет ряд функций, таких как расширяемый фильтр и кнопки заказа, настройка анимации, управляемой css3, постепенное ухудшение качества, опциональный обратный порядок, вы можете установить, поддерживает ли кнопка заказа поддержку или нет, и многое другое. Ссылка
16. Isotope
![](https://web7.pro/wp-content/uploads/2019/01/Isotope-500x247.jpeg)
Isotope — это изысканный плагин jQuery для магических макетов. Вы можете выявить и скрыть элементы с помощью фильтрации и переупорядочить элементы с помощью сортировки. Синтаксис очень прост, но макеты могут быть действительно динамичными и интеллектуальными. А также, прогрессивно улучшен для CSS3 преобразований и переходов. Ссылка
17. Dynatable
![](https://web7.pro/wp-content/uploads/2019/01/dynatable-500x247.jpeg)
Dynatable — это динамичный, семантический интерактивный плагин для таблиц, использующий jQuery, HTML5 и JSON. И это не только для таблиц. Dynatable предоставляет платформу для реализации наиболее распространенных элементов из коробки, включая сортировку, поиск и фильтрацию. Прежде всего, Dynatable — это чистый и элегантный API, который интересно использовать. Ссылка
18. Bootstrap Dropdown
![](https://web7.pro/wp-content/uploads/2019/01/Bootstrap-Dropdown-Filter-for-jPList-500x288.jpeg)
Bootstrap Dropdown Filter — это элемент управления для jPList, библиотеки с открытым исходным кодом для сортировки, фильтрации и разбиения на страницы. Он позволяет фильтровать любую структуру HTML (DIVs, UL / LI, таблицы и т. Д.) По заданному пути jQuery и использует стандартный раскрывающийся компонент Bootstrap для макета. Ссылка
19. Table Sorter
![](https://web7.pro/wp-content/uploads/2019/01/table-sorter-500x247.jpeg)
Tablesorter — это плагин jQuery для преобразования стандартной таблицы HTML с тегами THEAD и TBODY в сортируемую таблицу без обновления страницы. Tablesorter может успешно анализировать и сортировать многие типы данных, включая связанные данные в ячейке. Ссылка
20. WaTable
![](https://web7.pro/wp-content/uploads/2019/01/wa-table-500x247.jpeg)
Швейцарский плагин jQuery для таблиц с фильтром, форматированием, разбивкой на страницы и сортировкой данных с легкостью и скоростью. Ссылка