j-Dropdown

jComponent 20 · jcomponent@20 component Ejemplo cargado con jComponent 20

Configuración:

required {Boolean} (opcional) habilita "requerido" (predeterminado: false)
items {String} (opcional) elementos estáticos key1|value1, key2 with value, key3|value
icon {String} (opcional) icono para etiqueta, p. home, cog, etc.
Etiqueta label {String} (opcional) (el contenido predeterminado es HTML)
type {String} (opcional) puede ser number (convierte valores String a Number)
datasource {String} ruta a la fuente de datos (debe ser una matriz)
text {String} determina un nombre de propiedad para el texto (en la fuente de datos), predeterminado: name
value {String} determina un nombre de propiedad para el valor predeterminado (en la fuente de datos): id.
empty {String} (opcional) agrega un campo vacío
disabled {Boolean} (opcional) desactiva este componente
Función de flecha if {String} (opcional) como condición para filtrar la fuente de datos, ejemplo: if:n => !n.removed

Úselo con <ui-component name="dropdown">. Cuando el componente aún no está cargado, jComponent lo descarga en el primer uso desde la dirección en DEF.fallback (el CDN Componentator de forma predeterminada). Autor: Peter Širka. Fuente: repositorio de componentes Componentator, licencia MIT.

example.html

<div style="width:400px">
	<ui-component name="dropdown" path="form.idcategory" config="datasource:datasource;empty:;required:true;type:number;icon:navicon">Category</ui-component>
	<br />
	<ui-component name="dropdown" path="form.idinline" config="items:,A|1,B|2,C|3">Inline options</ui-component>
</div>

<script>
	var datasource = [{ name: 'A', id: 1 }, { name: 'B', id: 2 }, { name: 'C', id: 3 }];
	var form = {};
</script>