# j-Search

> Jednoduchý komponent fulltextového vyhľadávania. Tento komponent dokáže zobraziť/skryť prvky podľa hľadaného výrazu.

Framework: jcomponent20
Product: jComponent 20 (jcomponent@20)
Language: sk
Content-SHA256: 8ea1367ebaecfc9681c8ccf2e7ba4602b946e5ebc2fab485caf642f4013a57c1
Snapshot: c0700e321579725c5cf4f5ace1ad7d2866d1b4f93c24a63c0b41b6b7998e976c
Sources: components@910ed1a86f6e72b4f031d3ad0dc7844f9fc5cb8e
Review: not-recorded

Jednoduchý komponent fulltextového vyhľadávania. Tento komponent dokáže zobraziť/skryť prvky podľa hľadaného výrazu.


__Konfigurácia__:

- Selektor jQuery `selector {String}` na vyhľadávanie
- Atribút prvku `attribute {String}`, ktorý obsahuje hľadanú frázu (predvolené: `data-search`)
- `class {String}` táto trieda sa použije, ak sa prvok nenájde (predvolené: `hidden`)
- Oneskorenie pri písaní `delay {Number}` (predvolené: `50` ms)
- `delaydatasource {Number}` oneskorenie pre opätovné vyhľadávanie pri zmene zdroja údajov (predvolené: `100` ms)
- __UPD__ `exec {String}` odkaz na `function(stats:{ total: Number, count: Number, hidden: Number, search: String, is: Boolean })`, ktorý sa vyhodnotí, ak komponent niečo hľadá
- `datasource {String}` cesta k zdroju dát pre sledovanie zmien
- `splitwords {Boolean}` sa pokúša nájsť slovo na rôznych pozíciách (predvolené: `true`)
- __NEW__ `custom {String}` cesta k `Function(element, search) must return Boolean` pre vlastné vyhľadávanie

__Je dobré vedieť__:

Tento komponent automaticky pridáva nižšie uvedené triedy, keď:

- trieda `ui-search-used` sa pridáva, keď používateľ niečo hľadá
- trieda `ui-search-empty` sa pridáva, keď používateľ niečo hľadá a zároveň sa nič nenašlo

Použite ho so `<ui-component name="search">`. Keď komponent ešte nie je načítaný, jComponent ho stiahne pri prvom použití z adresy v `DEF.fallback` (predvolene CDN Componentator). Autor: Peter Širka. Zdroj: úložisko komponentov Componentator, licencia MIT.

```html 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>
```