j-DynamicValueList

jComponent 20 · jcomponent@20 component Exemplo carregado com jComponent 20

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) nullPor 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.

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

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

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>