j-InputTags

jComponent 20 · jcomponent@20 component Příklad načten s jComponent 20

Konfigurace:

required {Boolean} volitelně, umožňuje "potřebné" (předvolené: false)
icon {String} volitelné, ikona pro štítky např. home, cog, atd.
licon {String} volitelný, levá ikona např. home, cog, atd.
liconclick {String} volitelný, cesta k metodu function(component, input)
ricon {String} volitelný, pravá ikona např. home, cog, atd.
riconclick {String} volitelný, cesta k metodu function(component, input)
label {String} volitelné, štítek (default je obsah HTML)
after {String} je volitelný, znamená to char po štítku (default: :)
placeholder {String} volitelně, přidává text placeholder do vstupu
validate {String} volitelný, podmínka pro potvrzení hodnoty, může obsahovat odkaz na function(value) nebo !!value.match(/[a-z]+/)
disabled {Boolean} volitelně, tento složka je deaktivována
error {String} volitelně, přidává text string pod složkou
spaces {Boolean} volitelné, umožňuje prostory jinak je odstraňuje (předvolené: true)
innerlabel {Boolean} volitelné, umožňuje vnitřní značku (podmínkou: true)
dirsource {String} volitelně, cesta k datovému zdroji nebo NEW může obsahovat odkaz na metodu function(search, next(items_arr))
dircustom {String/Boolean} je volitelný, může obsahovat cestu k function(val, next(new_val)) nebo může být Boolean.Tato možnost umožňuje přidání vlastního hodnoty (hodnota není definována v zdroji údajů)
dirrender {String} volitelné, cesta k function(item, text) (musí vrátit HTML pro j-Directory), tato funkce může ovlivnit seznam položek v j-Directory
Volitelná šířka dirminwidth {Number}, minimální šířky pro j-Directory, výchozí: 200
dirmaxwidth {Number} volitelné, maximální šířka pro j-Directory
dirplaceholder {String} volitelné, místo držitele pro j-Directory
dirempty {String} volitelně, přidává prázdné pole pro j-Directory
dirkey {String} volitelný, klíčový název pro čtení text v dirsource (předvolený: name)
dirvalue {String} volitelný, klíčový název pro čtení value v dirsource (předvolený: id)
autosource {String} je cesta k funkci search v autocomplete, function(search, render(arr))
autovalue {String} je vlastnická cesta pro hodnotu v autosource
transform {Number} volitelně, přeměňuje text 0 - none, 1 - lowercase, 2 - uppercase, 3 - capitalize (default: 0)
enteronly {Boolean} je volitelný, přidává novou hodnotu po stisknutí klíče enter (předvolené: true)

Zajímavé je:

dirsource:path.to.datasource potřebuje _directory__ složku
Pokud licon nebo ricon začíná s !, pak složka představuje surovou hodnotu namísto icon.
dirsource s cestami k metodám může přenášet data asynchronně

Použijte ji s <ui-component name="inputtags">Pokud je součástka ještě nezačleněna, jComponent Stáhnout ji na první použití z adresy DEF.fallback a) The Componentator CDN dle předvolby. autor: Peter Širka. zdroj: Componentator Výrobce je autorizován, MIT licence.

example.html

<ui-component name="directory" config="placeholder:Search..."></ui-component>

<div style="width:400px">
	<ui-component name="inputtags" path="form.frameworks" config="required:1;placeholder:Type a framework name;dirsource:frameworks">Framework</ui-component>
	<br />
	<ui-component name="inputtags" path="form.countries" config="innerlabel:true">Country</ui-component>
</div>

<script>
	var frameworks = [{ id: 1, name: 'jComponent' }, { id: 2, name: 'Angular.js' }, { id: 3, name: 'React' }];
	var form = { framework: [1], countries: ['Slovakia', 'Poland', 'Hungary', 'Germany'] };
</script>