# j-InputTags

> j-InputTags: pokud se licon nebo ricon začíná ! pak složka přináší surovou hodnotu namísto ikony

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

__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.

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