Logo

Botones y Otros Elementos de Un Formulario HTML

En este tema aprenderemos a colocar botones de envío y borrado, campos invisible y botones normales en los formularios de HTML.

En los formularios no solo recogeremos información gracias a un botón de envío, o en caso de que el usuario se equivoque poder borrar con un botón de borrado o incluso que el envío de la información se acompañe de datos ocultos que nos ayuden a su clasificación.

1. Botón de envío

Una vez completado el formulario el navegante nos lo hará llegar gracias a un botón previsto a tal efecto. La construcción de este botón no tiene gran dificultad, porque ya conocemos una de las etiquetas que nos ayuda a esta labor y que ya hemos visto:

<input type=”submit” value=”Enviar”>

Este código dará como resultado el siguiente botón:



Como vemos tenemos que especificar dentro la etiqueta <input> que se trata de un botón de envío (type=”submit”), en el que podemos ponerle el nombre el atributo value.

2. Botón de borrado

Con este botón el usuario podrá borrar el formulario en su totalidad. Su código es muy similar al del botón de envío:

<input type=”reset” value=”Borrar”>

Este botón no es indispensable, es optativo. Tenemos que tener en cuenta de no colocarlo muy cerca del botón de envío, y diferenciarlo claramente de este para que el usuario no borre sus datos por error.

Datos ocultos

En ocasiones puede ser útil enviar conjuntamente con la información del usuario, otros datos definidos por nosotros que ayuden a una mejor gestión de toda la información del formulario. Estos datos que no se ven en la página pero si se ven en el código fuente. Ahora solo necesitamos saber que existen, ya los veremos más adelante, un ejemplo de sería:

<input type=hidden name=”sitio” value=”http://www.larevistainformatica.com”>

Con este código conseguimos que el programa encargado de la gestión de la información del formulario, conozca la página web donde esta el formulario que se encarga de recoger los datos, o incluso otra acción como un redireccionamiento, etc. Este tipo de código se suele usarse en las páginas que estan en servidores. Y como ya dijimos veremos posteriormente.

3. Botones Normales

En el formulario admite botones normales que se puedan pulsar. Estos botones por si mismos no tienen mucha utilidad pero puede que los necesitemos en un futuro. Su código sería:

<input type=button value=”Texto escrito sobre el botón”>

En el navegador lo veríamos así:



Ahora solo nos quedaría practicar todo lo visto anteriormente.

Siguiente Tema: Enlaces con Imágenes en el HTML

PÁGINA PRINCIPAL DEL CURSO CREACIÓN DE PÁGINAS WEB EN HTML