# j-DynamicValueList

> Tato složka je velmi speciální složka.Může udržovat hodnoty například číslo a zároveň může vytvořit další čitelný text.Tento složka se optimalizuje pro dynamické použití, takže musí být

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

Tento komponent je velmi speciální složka.Může udržovat hodnoty například `Number` a zároveň může činit další čitelný `text`.Tento komponent je optimalizován pro dynamické použití, takže musí být připojen k jinému komponentu nebo části.


__Konfigurace__:

- `icon {String}` ikona pro štítky např. domácí, cog atd.
- `label {String}` štítek (default je HTML obsah)
- `icon2 {String}` ikona v pravém krabici např. domů, hnízdek atd. (předvolené: `angle-down`)
- `placeholder {String}` přidává text
- `disabled {Boolean}` tento složek deaktivuje
- `find {String}` __important__ odkaz na `function(el, next(value))` pro zavedení nové hodnoty
- `read {String}` odkaz na `function(array_of_values, next(array_response))` pro připojení čitelného `text`
- `url {String}` se snaží spojit hodnotu prostřednictvím `AJAX()`, argument `{0}` v URL je nahrazen hodnotou
- `html {String}` Tangular šablona pro předávání hodnoty (předvolené: `{{ name }}`)
- `remap {String}` Funkce opravy (default) `null`a příkladem : `value.length ? value[0] : null`
- `required {Boolean}` umožňuje „potřebné“ (předvolené: `false`)
- `bind {String}` je cesta k metodu nebo variabilu, kde bude připojena nabízená hodnota (volitelná)
- `dirsource {String}` odkaz na metodu `function(search_string, next(items_arr))` nebo __NEW__: může obsahovat URL pro vyhledávání ve formě `GET /api/partners/?q={0}`
- `dircustom {String/Boolean}` může obsahovat cestu k funkci(val, další(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 dat)
- `dirrender {String}` je cesta k `function(item, text)` (musí vrátit HTML pro j-Directory), tato funkce může ovlivnit seznam položek v j-Directory
- Minimální šířka `dirminwidth {Number}` pro j-Directory (předvolená: `200`)
- `dirmaxwidth {Number}` Maximální šířka pro j-Directory
- `dirplaceholder {String}` - místo pro j-Directory
- `dirempty {String}` přidává prázdné pole pro j-Directory
- `dirkey {String}` - klíčové jméno pro čtení textu v zdrojovém zdroji (předvolené: `name`)
- `dirvalue {String}` je klíčový název pro čtení hodnoty v zdrojovém zdroji (předvolené: `id`)
- `key {String}` primární klíčové jméno (podle předvolby: hodnota od `dirvalue`)
- __NEW__ `tapi {Boolean}` umožňuje volání `TAPI()` insteadof `AJAX()` (případně: falešný)

### Použití Ajax

Pokud je `value` Změní se, pak se komponenty `AJAX` automaticky. server musí odpovídat `Array`.

```html
<ui-component name="dynamicvaluelist" path="path.to.property" config="url:/users/?id={0};dirsource:GET /users/?search={0}"></ui-component>
```

### Inline využití

Pokud se změna `value` provede, komponenta provede `config.exec` pro získání čitelného textu hodnoty.

```html
<ui-component name="dynamicvaluelist" path="path.to.property" config="read:my_function"></ui-component>

<script>
	function my_function(arr, next) {
		// the component automatically pairs "response" with "arr"
		next([{ id: 1, name: 'This text will be displayed as a value '}]);
	}
</script>
```

Použijte ji s `<ui-component name="dynamicvaluelist">`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"></ui-component>

<div class="m" style="width:300px">
	<ui-component name="dynamicvaluelist" path="common.users" config="read:getusers;dirsource:findusers;placeholder:Add user">Users</ui-component>
</div>

<script>
	var names = [];
	names.push({ id: '1', name: 'Denis' });
	names.push({ id: '2', name: 'Peter' });
	names.push({ id: '3', name: 'Tomáš' });
	names.push({ id: '4', name: 'Lucka' });
	names.push({ id: '5', name: 'Lenka' });

	function getusers(value, next) {
		var temp = [];
		for (var i = 0; i < value.length; i++) {
			var user = names.findItem('id', value[i]);
			user && temp.push(user);
		}
		next(temp);
	}

	function findusers(search, next) {
		var items = names.slice(0);
		next(items);
	}

</script>
```