¿Te gustaría saber cómo enviar y recibir información a través de formularios en HTML y PHP?
Te advertimos que este post no pretende enseñarte todos los conocimientos que deberías saber sobre seguridad y validación de formularios, simplemente te servirá de guía para entender como funciona el envío y recepción de los mismos.
Nuestro objetivo será crear un formulario sencillo para "registrarse" en una web. Lo primero que vamos a necesitar es un documento .html donde se va a crear nuestro formulario y un documento .php en donde se va a mostrar la información.
Siéntete libre de usar cualquier editor de texto y cualquier sistema operativo. Si usas GNU/Linux levanta un servidor LAMP con el comando: sudo apt-get install lamp-server^). La carpeta de trabajo la encontrarás en el sistema de archivos /var/www/html/. Si usas Windows puedes descargar XAMPP o WAMP-Server.
En mi caso usaré Gnu/Linux:
Abrimos nuestros archivos en nuestro editor de texto de preferencia.
Para la creación del formulario editaremos el archivo index.html añadiendo la estructura básica HTML5:
Dentro de la etiqueta body creamos un sencillo formulario con la etiqueta form y añadimos unos labels para la información que vamos a pedirle al usuario.
Nuestro siguiente paso es añadir los campos para que el usuario ingrese sus datos, esto lo haremos con la etiqueta input. Esta etiqueta tiene algunas propiedades que nos permiten clasificar y organizar la información según nuestra necesidad. Por ejemplo:
- type: define el tipo de información. type="text" ó type="password", entre otras.
- name: asocia un nombre al elemento.
- value: define un valor por defecto en el elemento.
Después de cada etiqueta label añadiremos el correspondiente input. Por último añadimos una etiqueta label tipo submit que nos servirá para crear un botón de envío.
En estos momentos las cosas están así:
Si le damos clic al botón de enviar observaremos que la información está siendo enviada a través de la url:
Nuestro objetivo ahora es capturar los datos enviados pero sin mostrarlos en la url. Para ello vamos a agregar dos propiedades a la etiqueta form:
- method: La propiedad method indica como se organizan esos datos para enviarlos al servidor, pudiendo ser mediante los métodos post o get (normalmente los datos de un formulario se envían mediante el método post).
- action: La propiedad action indica el nombre del archivo que recibirá los datos ingresados por el operador en el formulario y que serán enviados al servidor cuando se presione el botón (submit).
Una vez hecho eso vamos a editar nuestro archivo mostrar.php para recibir los datos.
Toda la información que enviamos a través de un formulario es almacenada en una variable tipo array llamada $_REQUEST a la cual le pasamos como indice el nombre que hallamos usado en la propiedad name de la etiqueta input. Si solo queremos recorrer el array podemos usar un foreach.
Y con esto hemos terminado nuestro formulario de "registro". ¿Qué sigue después?. Lo pertinente es hacer validaciones y manipular la información para poder almacenarla en una base de datos.
PD: no te lo quise decir con la esperanza de que te sorprendieras, HTML5 permite la validación de información desde el lado del cliente. En nuestro ejemplo el tipo email nos permite validar que el campo que se vaya a enviar tenga el formato de un email ejemplo@miemail.algo.lootro.
Queda en manos del lector consultar sobre validaciones con html5 y el uso de expresiones regulares.
Si te gustó el post compartelo.
No hay comentarios:
Publicar un comentario