j-Search

jComponent 20 · jcomponent@20 component Példa betöltve a jComponent 20-szal

Egyszerű teljes szövegű keresési komponens.Ez a komponens a keresési mondat szerint megmutatja / elrejti az elemeket.

konfiguráció:

selector {String} jQuery kiválasztó
attribute {String} elem attribútum, amely egy keresési mondatot tartalmaz (default: data-search)
class {String} Ez az osztály akkor kerül felhasználásra, ha az elem nem található (default: hidden)
delay {Number} nyomtatási késés (default: 50 ms)
delaydatasource {Number} késleltetése az új kereséshez, amikor az adatforrás megváltozik (default: 100 ms)
UPD exec {String} egy link a function(stats:{ total: Number, count: Number, hidden: Number, search: String, is: Boolean }) amely értékelni fogja, ha az összetevő keres valamit
datasource {String} az adatforrás felé vezető út a változások megfigyelésére
A splitwords {Boolean} megpróbálja megtalálni a szót különböző pozíciókban (default: true)
NEW custom {String} egy út a Function(element, search) must return Boolean a személyre szabott kereséshez

Jó tudni:

Ez az összetevő automatikusan hozzáadja az alábbi osztályokat, ha:

A ui-search-used osztály hozzáadódik, amikor a felhasználó keres valamit
A ui-search-empty osztályot akkor adják hozzá, amikor a felhasználó valamit keres és egyidejűleg semmit nem talált.

Használja a <ui-component name="search">Amennyiben a készülék még nem tölthető le, jComponent letöltés az első felhasználásra a címről DEF.fallback (Azt a Componentator A szerző: Peter Širka. forrás: a Componentator Az összetevők raktár, MIT licenc.

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>