# FilterText
<style>
    img {
        max-width: 100%;
    }
    pre {
        background-color: #F5F5F5;
        padding: .5rem;
    }
</style>

## Definición

Archivo: `induxsoft.controls.js`

Produce un campo de entrada similar al `input` de HTML que facilita el filtrado por texto.

<img src="/es/api/web-components/img/filtertext-demo-01.jpeg">


## Ejemplos

Maquetación HTML básica
```html
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>FilterText</title>
    <script src="../src/js/induxsoft.controls.js"></script>
</head>
<body>
    <form action="" method="GET">
        <filter-text auto-submit="true" text-field="search" url-parse="true"></filter-text>
    </form>
</body>
</html>
```


<!--
## Comentarios
...
-->

## Atributos

#### form (opcional)
Selector del formulario al que se realizará el submit (Si no se establece se busca el formulario más cercano).

Tipo: `string`, valor predeterminado: `""`
```html
<filter-text form="#filter-form">
```

#### auto-submit (opcional)
Establece si el formulario se envia al copletar el texto de búsqueda con la tecla `Enter``.

Tipo: `bool`, valor predeterminado: `false`
```html
<filter-text auto-submit="true">
```

#### text-field (opcional)
Nombre del campo que se envía al lanzarse la búsqueda

Tipo: `string`, valor predeterminado: `s`
```html
<filter-text text-field="search"> ...
```

#### value (opcional)
Valor inicial del filtro, si está esblecido el componente es bloqueado.

Tipo: `string`, valor predeterminado: `""`
```html
<filter-text value="">
```

#### placeholder (opcional)
Establece el texto (placeholder) a mostrar en el campo de entrada.

Tipo: `string`, valor predeterminado: `""`
```html
<filter-text placeholder="Buscar ...">
```

#### url-parse (opcional)
Establece el valor inicial a través de los parámetros de la URL únicamente si el atributo value no está establecido.

Tipo: `bool`, valor predeterminado: `false`
```html
<filter-text url-parse="false">
```


## Propiedades

- `dispatch_submit`: (true/false) Establece el método de envio del formulario por 'dispatchEvent()', por defecto se utiliza 'submit()'.

<!--
## Métodos

## Eventos
-->