# j-DynamicValueList

> Este componente é um componente muito especial. pode manter valores, por exemplo Número e no mesmo pode tornar outro texto leível. este componente está otimizado para uso dinâmico, então ele precisa ser

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

Este componente é um componente muito especial. pode manter valores, por exemplo, `Number` e ao mesmo tempo pode tornar outro `text`. este componente está otimizado para uso dinâmico, então ele precisa ser ligado a outro componente ou parte.


__Configuração__:

- Icon `icon {String}` para etiquetas, por exemplo, casa, cog, etc.
- `label {String}` (default é o conteúdo HTML)
- Icon `icon2 {String}` na caixa direita, por exemplo, casa, cog, etc. (default: `angle-down`)
- `placeholder {String}` adiciona um texto
- `disabled {Boolean}` desabilita esse componente
- `find {String}` __important__ link para `function(el, next(value))` para vincular um novo valor
- `read {String}` um link para `function(array_of_values, next(array_response))` para vincular uma leitura `text`
- `url {String}` tenta ligar um valor através de `AJAX()`, o argumento `{0}` na URL é substituído pelo valor
- `html {String}` Tangular para renderização de um valor (default: `{{ name }}`)
- `remap {String}` A função de remédio (default) `null`Por exemplo: `value.length ? value[0] : null`
- `required {Boolean}` permite o “requisito” (default: `false`)
- `bind {String}` - um caminho para o método ou variável onde o valor carregado será ligado (opcional)
- `dirsource {String}` um link para o método `function(search_string, next(items_arr))` ou __NEW__: pode conter URL para pesquisa no formulário `GET /api/partners/?q={0}`
- `dircustom {String/Boolean}` pode conter um caminho para a função(val, próximo(new_val)) ou pode ser Boolean. esta opção pode permitir adicionar um valor personalizado (valor não definido na fonte de dados)
- `dirrender {String}` um caminho para `function(item, text)` (deve retornar HTML para j-Directory), esta função pode afetar a lista de itens em j-Directory
- `dirminwidth {Number}` uma largura mínima para j-Directory, (default: `200`)
- `dirmaxwidth {Number}` a largura máxima para j-Directory
- `dirplaceholder {String}` um local para j-Directory
- `dirempty {String}` adiciona um campo vazio para j-Directory
- `dirkey {String}` um nome chave para a leitura de texto em dirsource (default: `name`)
- `dirvalue {String}` um nome chave para a leitura de valor em dirsource (default: `id`)
- `key {String}` um nome chave primário (default: um valor de `dirvalue`)
- __NEW__ `tapi {Boolean}` permite chamar `TAPI()` insteadof `AJAX()` (default: falso)

### Usando o Ajax

Se o `value` A partir daí, o componente será alterado `AJAX` O servidor tem que responder automaticamente `Array`.

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

### Uso Inline

Se o `value` for alterado, então o componente executa `config.exec` para obter um texto leível de um valor.

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

Use-o com `<ui-component name="dynamicvaluelist">`Quando o componente ainda não está carregado, jComponent Descarrega-o no primeiro uso do endereço `DEF.fallback` (a partir do Componentator CDN por padrão). autor: Peter Širka. fonte: o Componentator Reserva de componentes, licença 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>
```