Фильтруемые элементы
Все элементы, которые имеют более чем один дочерний элемент, может быть отфильтрован.
Как создать поле поиска:
- Элемент , который вы хотите быть фильтрованию, должна включать в себя data-filter="true" атрибут.
- Создание <input> элемент с указанным идентификатором и добавить data-type="search" атрибут. Это создаст основную область поиска. Оберните <input> в форме, а также добавить "ui-filterable" класс в <form> элемента - это будет корректировать разницу между полем поиска и фильтруемых элемента.
- Затем добавьте data-input атрибута к фильтруемой элемента. Его значение должно соответствовать идентификатор <input> элемента.
Ниже мы создали нефильтруемого вид списка:
Поиск элементов в списке
<form class="ui-filterable">
<input id="myFilter"
data-type="search">
</form>
<ul data-role="listview"
data-filter="true" data-input="#myFilter" >
<li><a href="#">Adele</a></li>
<li><a href="#">Billy</a></li>
<li><a href="#">Calvin</a></li>
</ul> Попробуй сам " Совет: Используйте заполнитель , чтобы указать краткую подсказку , которая описывает ожидаемое значение в поле поиска:
Пользовательский фильтр
Текст внутри каждого дочернего элемента фактический текст , который используется для фильтрации (например , "Adele" или "B" за "Billy" ). Тем не менее, если вы хотите, чтобы отфильтровать поиск по тексту пользовательского фильтра вместо этого, вы можете добавить атрибут данных filtertext к любому дочернему элементу:
При использовании data-filtertext атрибут на элемент, исходный текст / содержание этого элемента не игнорируется для фильтрации (В приведенном выше примере, вы больше не в состоянии искать элемент списка "Adele" . Вы можете найти только Адель, введя ключевые слова "f, a, v или fav ".)
Еще примеры
Фильтр Складные Списки
Как фильтровать разборную набор списков.
Фильтр Столы
Как отфильтровать таблицу.
Фильтр <div> элементы
Как фильтровать <div> элемент , содержащий дочерние <p> элементы.