# j-Input > j-Input es un componente de entrada multifuncional que admite muchas funciones y está optimizado para el uso diario. Es una gran alternativa a j-Textbox y j-Dropdown. Funciona sólo con jComponent +v17. Framework: jcomponent20 Product: jComponent 20 (jcomponent@20) Language: es Content-SHA256: 4b25dc5fd19f2f72c6e3cecdf067cdfd6a82192b13b561bb711835fa3f288966 Snapshot: c0700e321579725c5cf4f5ace1ad7d2866d1b4f93c24a63c0b41b6b7998e976c Sources: components@910ed1a86f6e72b4f031d3ad0dc7844f9fc5cb8e Review: not-recorded __j-Input__ es un componente multifuncional `input` que admite muchas funciones y está optimizado para el uso diario. Es una gran alternativa a `j-Textbox` y `j-Dropdown`. Funciona sólo con jComponent `+v17`. __Configuración__: - `type {String}` opcional, valores: - valor vacío significa valor predeterminado `text` - `email`, - `multiline` - `checkbox` - `phone` - `password` - `zip` - `date` (necesita el componente `datepicker`) - __NUEVO__: `datetime` (necesita el componente `datepicker`) - `time` (necesita el componente `timepicker`) - `color` (necesita el componente `colorpicker`) - `icon` (necesita el componente `faicons`) - `emoji` (necesita el componente `emoji`) - `url` - `number` - `number2` (anulable) - `search` - `lower` - `upper` - `slug` - `id` - __NUEVO__: `radiobutton` - __NUEVO__: `tags` - __NUEVO__: `tags-lower` - __NUEVO__: `tags-upper` - __NUEVO__: `tags-id` - __NUEVO__: `tags-email` - __NUEVO__: `tags-slug` - __NUEVO__: `tags-phone` - __NUEVO__: `tags-url` - `required {Boolean}` opcional, habilita "requerido" (predeterminado: `false`) - `icon {String}` opcional, icono para etiqueta, p. `home`, `cog`, etc. - `licon {String}` opcional, icono izquierdo, p.e. `home`, `cog`, etc. - `liconclick {String}` opcional, una ruta al método `function(component, input)` - `ricon {String}` opcional, icono derecho, p.e. `home`, `cog`, etc. - `riconclick {String}` opcional, una ruta al método `function(component, input)` - `label {String}` opcional, una etiqueta (el contenido predeterminado es HTML) - `autofocus {Boolean}` opcional, enfoca la entrada (por defecto: `false`) - `align {String}` opcional, `left` (predeterminado), `2` / `right` o `1` / `center` - `after {String}` opcional, significa un carácter después de la etiqueta (predeterminado: `:`) - `autofill {Boolean/String}` opcional, habilita la función de autocompletar del navegador (`string` se usará como nombre de entrada, predeterminado: `false`) - `placeholder {String}` opcional, agrega un texto `placeholder` en la entrada - `maxlength {Number}` opcional, establece una longitud máxima de caracteres (predeterminado: `200`) - `minlength {Number}` opcional, establece una longitud mínima de caracteres - `minvalue {Number}` opcional, un valor mínimo para el tipo `number` - `maxvalue {Number}` opcional, un valor máximo para el tipo `number` - `increment {Number}` opcional, establece un valor para incrementar (predeterminado: `1`) - `validate {String}` opcional, una condición para validar el valor, puede contener un enlace a `function(value)` o `!!value.match(/[a-z]+/)` - `format {String}` opcional, formato de salida, p. para `date` tipo: `yyyy-MM-dd`, para `time` tipo: `HH:mm`, para `number` puede definir máx. decimales (predeterminado: `auto`) - `disabled {Boolean}` opcional, desactiva este componente - `error {String}` opcional, agrega un texto `string` debajo del componente - `autocomplete {String}` opcional, debe contener un enlace a una función, se activa en el evento `focus` - `spaces {Boolean}` opcional, habilita espacios, de lo contrario los elimina (predeterminado: `true`) - `innerlabel {Boolean}` opcional, habilita etiqueta interior (por defecto: `true`) - `dirsource {String}` opcional, ruta a una fuente de datos o __NEW__ a `function(search, next)` (la ruta debe contener `/` o __NEW__: `id|name,id|name` - `dircustom {String/Boolean}` opcional, puede contener una ruta a `function(val, next(new_val))` o puede ser `Boolean`. Esta opción puede permitir agregar un valor personalizado (valor no definido en la fuente de datos) - `dirrender {String}` opcional, una ruta a `function(item, text)` (debe devolver HTML para `j-Directory`), esta función puede afectar la lista de elementos en `j-Directory` - `dirminwidth {Number}` opcional, un ancho mínimo para `j-Directory`, predeterminado: `200` - `dirmaxwidth {Number}` opcional, un ancho máximo para `j-Directory` - `diroffsety {Number}` opcional, desplazamiento `Y` (predeterminado: `0`) - `diroffsetx {Number}` opcional, desplazamiento `X` (predeterminado: `0`) - `dirplaceholder {String}` opcional, un marcador de posición para `j-Directory` - `dirempty {String}` opcional, agrega un campo vacío para `j-Directory` - `dirkey {String}` opcional, un nombre clave para leer `text` en `dirsource` (predeterminado: `name`) - `dirvalue {String}` opcional, un nombre clave para leer `value` en `dirsource` (predeterminado: `id`) - `direxclude {Boolean}` opcional, excluye un valor actual de `j-Directory` (predeterminado: `true`) - `dirsearch {Boolean|String}` opcional, puede deshabilitar la búsqueda en `j-Directory` (predeterminado: `true`) o `{String}` (nombre de clave) puede asignar un valor para la búsqueda - `dirraw {Boolean}` opcional, puede desactivar el escape de elementos para `j-Directory` (predeterminado: `false`) - `dirdetail {String}` opcional, un enlace a la función `function(val, next(NEW_TEXT))` (destinada a `dirsource`) - `dirfilter {String}` opcional, un método condicional de filtro en línea, por ejemplo: `value.id !== 2` (destinado a `dirsource`) - __NUEVO__: `dirrawrender {Boolean}` opcional, si `dirsource` no incluye valor, generará un valor sin procesar (predeterminado: `true`) - `mask {String}` opcional, puede contener una máscara con el formato `###/##` (`#` se reemplaza por un carácter) - `maskregexp {String}` opcional, puede contener RegExp para cada carácter en el formato `\d,\d,\d,null,\d,\d` (`,` es el delimitador) - `masktidy {Boolean}` opcional, el componente devuelve solo caracteres sin formato sin caracteres fijos (predeterminado: `false`) - `autosource {String}` una ruta a la fuente de búsqueda `Array` (__NEW__) o `function(search, render(arr))` para búsqueda dinámica - `autovalue {String}` una ruta de propiedad para el valor en `autosource`, predeterminado: `name` - `autoexec {String}` un método de ruta `function(item, next(value_to_input))` - `searchalign {Number}` puede alinear el ícono en `type:search` hacia la izquierda (`2`) o hacia la derecha (`1`, predeterminado) - `forcevalidation {Boolean}` habilita la validación forzada para `phone` y `email` (predeterminado: `true`) - `camouflage {Boolean|String}` enmascara el valor en la entrada después de que se activa el evento `blur` (predeterminado: `false`) o puede ser `String` que se usará como camuflaje. - `monospace {Boolean}` habilita la fuente `monospaced` (predeterminada: `false`) - `multiple {Boolean}` habilita casillas de verificación si `dirsource` no está vacía - `tabindex {Number}` agrega un índice de tabulación (predeterminado: `0`) - `tabs {Boolean}` habilita pestañas para varias líneas (predeterminado: `true`) - Edición de campo de texto en bloque `readonly {Boolean}` (predeterminado: `false`) - `transform {String}` un enlace al `function(value, config)` para transformar los valores ingresados - `multiline {Boolean}` funciona sólo con el tipo `radiobutton` - `separator {String|Boolean}` un separador para múltiples valores renderizados - `realtime {Boolean}` habilita el enlace en tiempo real (predeterminado: `true`) - `exec {String}` un enlace al `function(value, element)` que será evaluado si la entrada se ve afectada __Interesante:__ - `type:date` necesita el componente __`datepicker`__ - `type:time` necesita el componente __`timepicker`__ - `dirsource:path.to.datasource` necesita el componente __`directory`__ - si `licon` o `ricon` comienzan con `!`, entonces el componente representa un valor sin formato en lugar de `icon`. - La clase `ui-input-ok` se vincula cuando la entrada se valida y completa - `SET('path', 'camouflage', 'show');` muestra el valor de 2000 ms ```video https://www.youtube.com/watch?v=Ne3ezaP0w34 ``` Úselo con ``. 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. ```html example.html
Framework I agree with terms Notes Frameworks
City
Tags
Date
Search
Password
ZIP
Email
Phone
Gender
Gender
Your age
```