# j-InputTags

> j-InputTags: ако ликонът или риконът започва с ! тогава компонентът прави сурова стойност вместо икона

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

__Конфигуриране__:

- `required {Boolean}` опционално, позволява "необходимо" (дефолт: `false`)
- `icon {String}` опция, икона за етикет например `home`, `cog`, и т.н.
- `licon {String}` опционален, лев икон например `home`, `cog`, и т.н.
- `liconclick {String}` опционален, пътят към метода `function(component, input)`
- `ricon {String}` опция, дясна икона, например `home`, `cog`, и т.н.
- `riconclick {String}` опционален, пътят към метода `function(component, input)`
- `label {String}` опция, етикет (предварително е HTML съдържание)
- `after {String}` е опционален, което означава захранване след етикета (дефолт: `:`)
- `placeholder {String}` опционално, добавя текст на `placeholder` към входа
- `validate {String}` опция, условие за валидиране на стойността, може да съдържа връзка към `function(value)` или `!!value.match(/[a-z]+/)`
- `disabled {Boolean}` опционално, деактивира този компонент
- `error {String}` опционално, добавя текст на `string` под компонента
- `spaces {Boolean}` е опционален, позволява пространства в противен случай те се отстраняват (предварително: `true`)
- `innerlabel {Boolean}` опция, позволяваща вътрешна етикета (дефолт: `true`)
- `dirsource {String}` опция, пътят към източник на данни или __NEW__ може да съдържа връзка към метода `function(search, next(items_arr))`
- `dircustom {String/Boolean}` опция, може да съдържа път към `function(val, next(new_val))` или може да бъде `Boolean`. Тази опция може да позволи добавяне на персонализирана стойност (цена, която не е дефинирана в източника на данни)
- `dirrender {String}` опционален, пътят към `function(item, text)` (може да се върне HTML за `j-Directory`), тази функция може да повлияе на списъка с елементи в `j-Directory`
- `dirminwidth {Number}` опционално, минимална ширина за `j-Directory`, по подразбиране: `200`
- `dirmaxwidth {Number}` опция, максимална ширина за `j-Directory`
- `dirplaceholder {String}` опция, място за `j-Directory`
- `dirempty {String}` опционално, добавя празно поле за `j-Directory`
- `dirkey {String}` опционално, ключово име за четене на `text` в `dirsource` (предварително: `name`)
- `dirvalue {String}` опционално, ключово име за четене на `value` в `dirsource` (предварително: `id`)
- `autosource {String}` е пътят към функцията `search` в `autocomplete`, `function(search, render(arr))`
- `autovalue {String}` е свойствен път за стойността в `autosource`
- `transform {Number}` опционално, преобразува текста `0 - none, 1 - lowercase, 2 - uppercase, 3 - capitalize` (дефолт: `0`)
- `enteronly {Boolean}` опционално, добавя нова стойност след натискане на ключа `enter` (предварително: `true`)

__Интересното е:__

- `dirsource:path.to.datasource` изисква __`directory`__ компонент
- Ако `licon` или `ricon` започва с `!`, тогава компонентът дава сурова стойност вместо `icon`.
- `dirsource` с пътеки до методи може да зарежда данни без синхрон

Използвайте го с `<ui-component name="inputtags">`Когато компонентът все още не е зареден, jComponent Изтегляне на първия адрес в `DEF.fallback` (След това Componentator Източник: Питър Шерка Componentator Съставни съставки, лиценз на MIT.

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