# j-Form

> La nueva versión de este componente admite la evaluación dinámica del contenido de <script type='text/html'>. El siguiente ejemplo contiene un script con HTML y el componente evalúa el contenido si el j-Fo

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

__Configuración__:

- Título del formulario `title {String}`
- `width {Number}` forma ancho máximo
- `if {String}` condición para mostrar el formulario, se compara con el valor dentro de `path`
- `icon {String}` Icono de fuente impresionante sin `ti-` o __nuevo__: `ti ti-home`
- Enlace `reload {String}` a un `function(form_component)` global y se ejecuta si se muestra el formulario.
- Enlace `submit {String}` a un `function(hide)` global y se ejecuta si se presiona el botón de enviar
- `cancel {String}` enlaza a un `function(hide)` global y se ejecuta si se presiona el botón cancelar
- `enter {Boolean}` captura la clave `enter` automáticamente y realiza el envío (predeterminado: `false`)
- `center {Boolean}` centra el formulario en la mitad de la pantalla
- `autofocus {Boolean/String}` puede enfocar una entrada. `String` === `jQuery selector` para la entrada
- `default {String}` un alias corto para `DEFAULT(default, true)`
- `closebutton {Boolean}` puede ocultar el botón `x` (predeterminado: `false`)
- `zindex {Number}` puede afectar el índice z (predeterminado: `12`)
- `scrollbar {Boolean}` habilita la barra de desplazamiento personalizada (predeterminado: `true`)
- `closeoutside {Boolean}` cierra el formulario cuando el usuario hace clic fuera del formulario (predeterminado: `false`)
- `closeesc {Boolean}` cierra el formulario cuando el usuario presiona la tecla `ESC`
- `independent {Boolean}` el cierre no depende de la condición según el camino
- Enlace `close {String}` a un `function()` global y se ejecuta si el formulario se está cerrando.
- __NEW__ `hide {String}` enlace a un `function()` global y se ejecuta si el formulario se oculta

__Es bueno saberlo__:

La nueva versión de este componente admite la evaluación dinámica del contenido de `<script type="text/html">`. El siguiente ejemplo contiene un script con HTML y el componente evalúa el contenido si se mostrará j-Form (solo una vez).

```html
<ui-component name="form" path="path" config="config">
	<script type="text/html">
		A CONTENT
	</script>
</ui-component>
```

Úselo con `<ui-component name="form">`. 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
<ui-component name="form" path="common.form" config="if:user;width:500;title:Title;submit:userform_submit" class="hidden">
	<div style="padding:20px">SOME CONTENT</div>
	<nav>
		<button name="submit">SUBMIT</button>
		<button name="cancel">CANCEL</button>
	</nav>
</ui-component>

<script>

	function userform_submit(hide) {
		alert('SUBMIT');
		hide();
	}

	var common = {};

	// Show the form
	common.form = 'user';
</script>
```