j-Search

jComponent 20 · jcomponent@20 component Przykład załadowany z jComponent 20

Element wyszukiwania w pełnym tekście: ten element może wyświetlać/skrywać elementy według frazy wyszukiwarki.

Konfiguracja:

selector {String} jQuery wybór do wyszukiwania
Element attribute {String} zawierający frazę wyszukiwania (default: data-search)
class {String} ta klasa będzie używana, jeśli element nie jest znaleziony (default: hidden)
delay {Number} opóźnienie w pisaniu (default: 50 ms)
delaydatasource {Number} opóźnienie w ponownym wyszukiwaniu, gdy źródło danych jest zmienione (default: 100 ms)
UPD exec {String} link do function(stats:{ total: Number, count: Number, hidden: Number, search: String, is: Boolean }) który zostanie oceniony, jeśli składnik szuka czegoś
datasource {String} - droga do źródła danych do monitorowania zmian
splitwords {Boolean} próbuje znaleźć słowo w różnych pozycjach (default: true)
NEW custom {String} - droga do Function(element, search) must return Boolean dla wyszukiwania dostosowanego

Dobrze wiedzieć:

Ten element dodaje poniższe klasy automatycznie, gdy:

Klasa ui-search-used jest dodana, gdy użytkownik szuka czegoś
Klasa ui-search-empty jest dodana, gdy użytkownik szuka czegoś i jednocześnie nic nie znaleziono

Użyj go z <ui-component name="search">Gdy element nie jest jeszcze ładowany, jComponent Pobierz go po pierwszym użyciu z adresu DEF.fallback (Wydaje się Componentator Autor: Peter Širka Źródło: Componentator Zestaw składników, licencja MIT.

example.html

<ui-component name="textbox" path="search" config="type:search"></ui-component>
<br />
<ui-component name="search" path="search" config="selector:div">
	<div data-search="Apples">Apples</div>
	<div data-search="Oranges">Oranges</div>
	<div data-search="Pears">Pears</div>
	<div data-search="Black-eye bean">Black-eye bean</div>
	<div data-search="Broccoli">Broccoli</div>
</ui-component>

<script>
	var search = '';
</script>