# j-DynamicValueList

> Questo componente è un componente molto speciale. può mantenere i valori, ad esempio Numero e allo stesso tempo può rendere un altro testo leggibile.

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

Questo componente è un componente molto speciale. può mantenere i valori per esempio `Number` e allo stesso tempo può rendere un altro leggibile `text`.Questo componente viene ottimizzato per l'uso dinamico, quindi deve essere collegato ad un altro componente o parte.


__Configurazione__:

- Icon `icon {String}` per l'etichetta, ad esempio casa, cog, ecc.
- L’etichetta `label {String}` (contenuto predefinito HTML)
- L'icona di `icon2 {String}` nella casella destra, ad esempio casa, cog, ecc. (default: `angle-down`)
- `placeholder {String}` aggiunge un testo di localizzazione
- `disabled {Boolean}` disabilita questo componente
- `find {String}` __important__ collegamento a `function(el, next(value))` per legare un nuovo valore
- `read {String}` un collegamento a `function(array_of_values, next(array_response))` per legare una `text` leggibile
- `url {String}` cerca di collegare un valore tramite `AJAX()`, l'argomento `{0}` nell'URL viene sostituito dal valore
- Il modello `html {String}` Tangular per rendere un valore (default: `{{ name }}`)
- `remap {String}` La funzione di rimborso (default) `null`Il esempio: `value.length ? value[0] : null`
- `required {Boolean}` permette “necessario” (default: `false`)
- `bind {String}` un percorso per il metodo o variabile in cui verrà collegato il valore caricato (opzionale)
- `dirsource {String}` un collegamento al metodo `function(search_string, next(items_arr))` o __NEW__: può contenere URL per la ricerca nel modulo `GET /api/partners/?q={0}`
- `dircustom {String/Boolean}` può contenere un percorso a funzione(val, next(new_val)) o può essere Boolean.Questa opzione può consentire l'aggiunta di un valore personalizzato (valore non definito nella fonte dati)
- `dirrender {String}` un percorso a `function(item, text)` (deve essere restituito HTML per j-Directory), questa funzione può influenzare l'elenco degli articoli in j-Directory
- `dirminwidth {Number}` una larghezza minima per j-Directory, (default: `200`)
- `dirmaxwidth {Number}` a larghezza massima per j-Directory
- `dirplaceholder {String}` per il sito di j-Directory
- `dirempty {String}` aggiunge un campo vuoto per j-Directory
- `dirkey {String}` un nome chiave per la lettura del testo in dirsource (default: `name`)
- `dirvalue {String}` un nome chiave per la lettura del valore in dirsource (default: `id`)
- `key {String}` un nome chiave primario (default: un valore da `dirvalue`)
- __NEW__ `tapi {Boolean}` consente di chiamare `TAPI()` insteadof `AJAX()` (default: falso)

### Uso di Ajax

Se il `value` Si cambierà il componente `AJAX` Chiamate automaticamente. il server deve rispondere con `Array`.

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

### Uso in linea

Se il `value` viene modificato, allora il componente esegue `config.exec` per ottenere un testo leggibile di un valore.

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

Utilizzare con `<ui-component name="dynamicvaluelist">`Quando il componente non è ancora caricato, jComponent Scarica il codice in prima utilizzazione dall'indirizzo `DEF.fallback` (Il Componentator La storia di Peter Širka.Fonte: il Componentator Ristorante dei componenti, licenza MIT.

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