En el concepto anterior vimos como implementar un formulario básico.
Veamos ahora con más detenimiento el elemento input. Este elemento hemos visto que nos permite definir cuadros de texto y botón para subir los datos al servidor. Ahora veremos que también podemos definir cuadros para el ingreso de una clave y botones para borrar el contenido de todos los controles del formulario.
Confeccionaremos un formulario que solicite el ingreso del nombre de un usuario y su clave:
<!DOCTYPE html> <html> <head> <title>Prueba de formulario</title> <meta charset="UTF-8"> </head> <body> <form action="registrardatos.php" method="post"> Ingrese su nombre: <input type="text" name="nombre" size="20"> <br> Ingrese su clave: <input type="password" name="clave" size="12"> <br> <input type="submit" value="enviar"> <input type="reset" value="borrar"> </form> </body> </html>
El resultado en el navegador es:
Veamos la sintaxis nueva para definir un cuadro de texto para el ingreso de una clave:
<input type="password" name="clave" size="12">
Utilizamos el mismo elemento input pero inicializamos la propiedad type con el valor "password", con esto logramos que cuando el visitante ingrese la clave se visualicen asteriscos en lugar de los caracteres que tipeamos.
Luego para definir un botón que permita borrar todos los datos ingresados hasta el momento lo hacemos mediante:
<input type="reset" value="borrar">
Es decir inicializamos la propiedad type con el valor "reset", con esto sabe el navegador que cuando dicho botón sea presionado debe borrar todos los controles de ingreso de datos de dicho formulario.
Otra cosa que hay que tener en cuenta que la propiedad name de cada elemento input debe tener un nombre distinto (esto debido a que en el servidor se lo rescata a partir de este nombre)