UNIDAD CERO Crear formularios en HTML. La creación de formularios en html es muy importante en el desarrollo de aplicaciones web dinámicas, tomando en cuenta que estos son los encargados (formularios) de recoger la información que ha de ser procesadas. Esta unidad que la denominamos cero será un repaso de html, específicamente en lo relacionado con la creación de formularios. Para la creación básica de formularios en html, primero necesitamos de la ejecución de un editor de texto y trabajar con un archivo con extensión.html. Un formulario siempre empezara con la etiqueta <form> y sus respectivos atributos, seguida de los dispositivos de entradas que necesitemos: campos de texto, botones, casillas de verificación, el botón de envío; y terminar con la etiqueta de cierre </form>. Los pasos para la creación de un formulario: 1. Inicio: El formulario comienza con la etiqueta <form>. 2. Acción: El atributo action de la etiqueta <form> es el URL del script PHP que procesa los datos de entrada del formulario. 3. Método: Proporciona un método http para procesar los datos de entrada. Aunque el método por defecto es GET. 4. Creación: Crea el formulario con botones, campos de texto y cualquier cosa que sea atractiva apara el usuario, utilizando etiquetas HTML y campos. 5. Envío: Crear un botón de envío para que se pueda procesar el formulario y para que se cargue el programa que se especifica en el atributo action. 6. Fin: finalizar el formulario con la etiqueta </form>. Recordemos que para terminar el documento debemos cerrar la etiqueta </html>. Figura 0.1
A continuación tenemos el código html que genera el formulario de la Figura 0.1: <html> <head> <title>php PARA TODOS</title></head> <body> <h2><center> PHP PARA TODOS</center></h2><hr /> <form action="phpform0.php" method="get"> <b> Ingrese su Nombre:</b> <input type="text" name="nombre" size=50 /> <b>informacion Personal:</b> <textarea name="infopersonal" rows="6" cols="50">soy originario de...</textarea> <b>tipos De Libros De Su Preferencia :</b> <input type="radio" name="tipos" ="Clasicos" />Clasicos <input type="radio" name="tipos" ="Cientificos" />Cientificos <input type="radio" name="tipos" ="Informáticos" />Informáticos <input type="radio" name="tipos" ="Ciencias puras" />Ciencias Puras <input type="radio" name="tipos" ="Ciencias sociales" />Ciencias Sociales <strong>cual de estos libros has leido? </strong> <input type="checkbox" name="leidos" ="Doña Barbara" />Doña Barbara <input type="checkbox" name="leidos" ="Don Quijote" />Don Quijote <input type="checkbox" name="leidos" ="La Iliada" />La Iliada <strong>autor Latino Americano Preferido </strong> <select name="autor"> <option selected ="Romulo Gallegos">Romulo Gallegos <option ="Arturo Uslar Prieti">Arturo Uslar Prieti <option ="Miguel Otero Silva">Miguel Otero Silva </select> <input type="submit" ="ACEPTAR" /> <BR /> <input type="reset" ="Borrar" /> </form> </body> </html>
El presente código lo explicaremos detalladamente a continuación: 1. <form action="phpform0.php" method="get">: esta etiqueta es la que permite iniciar el fomulario pero tambien mediante el atributo action envia la información tomada a un archivo de nombre phpform0.php el cual tendrá la función de procesar los datos, aun cuando solo los muestre, por otra parte encontramos el atributo method, que tiene la función de escoger entre dos métodos el post o el get, en este caso escogimos el método get. El método get le dice al navegador que envíe al servidor una cadena codificada en el URL, que se llama cadena de consulta, y que adjunte esta cadena al final de la URL, en la barra de dirección del navegador. Este método se utiliza cuando realizamos búsquedas, o se trabaja con paginas estáticas y las cadenas de datos tienen un tamaño limitado véase la figura 0.2. Figura 0.2 Si utiliza el método post, se tiene que añadir method a la etiqueta <form>, de no hacerlo se utiliza el método get por defecto. Con el método post, el navegador envía al servidor un mensaje codificado en el cuerpo de la petición URL y no en la cabecera, lo que permite transferir grandes cantidades de datos al servidor. No tiene un tamaño limitado y no aparece en el historial del navegador. 2. La tabla 0.1 contiene los elementos de un formulario para la entrada de datos que podemos utilizar: Elemento Atributo Descripción text name size maxlength Crea un campo de texto para entrada de datos. Size especifica el tamaño del campo, y maxlength especifica el número máximo de caracteres textarea name size rows size cols Crea un area de texto que acepta datos de entrada, en varias líneas. Size rows y size cols determinan el tamaño en la cantidad de filas y columnas. pasword name Es un campo de texto que esconde los datos de entrada con la aparición de asteriscos en vez de los caracteres que escribió el usuario. checkbook name Muestra casillas que se pueden marcar. Crea un par valor es nombre-valor a partir de los datos proporcionados por el usuario. Se pueden marcar varias casillas. radio name Crea una casilla de selección en la cual solo se puede escoger una. select name Crea listas desplegables de las cuales solo se puede escoger una opción Option size multiple file name Especifica los archivos que suben al servidor. El tipo MIME debe ser multipart/form-date hidden name Proporciona una par nombre-valor sin mostrar un objeto en pantalla.
Elemento Atributo Descripción submit name Cuando se hace clic sobre él, se ejecuta el formulario. Carga el CGI. Image $src align Hace lo mismo que el botón submit, pero muestra una imagen en vez de texto. La imagen esta en el archivo que especifica SRC. reset name Reinicia el formulario a su posición original. Limpia todos los campos de entrada PHP y los formularios: Un script de php puede aceptar los datos de entrada del usuario de varias maneras. Del formulario figura 0.2 realizaremos un script para demostrar como php logra tomar los valores del formulario y mostrarlos(figura 0,3). Figura o.2 figura 0.3 <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>php PARA TODOS</title> </head> <body> <h2><center> PHP PARA TODOS</center></h2><hr /> <h2>datos CARGADOS EN EL FORMULARIO</h2> <?php echo "<h4>"; echo "El nombre cargado en el formulario es: ".$nombre; echo "<br>su información personal es la sigueinte: ".$infopersonal; echo "<br>el libro de sus preferencia es: ".$tipos; echo "<br>los libros leidos son: ".$leidos; echo "<br>el autor de tu preferncia es: ".$autor; echo "</h4>";?> </body> </html>
Las tres formas que utiliza PHP para crear variables que contengan la información de los formularios son las siguientes: 1. El estilo corto. Por ejemplo : $infopersonal, $tipos, $leidos. 2. El estilo medio. Por ejemplo: $_get[ infopersonal ], $_get[ tipos], $_get[ leidos ]. 3. El estilo largo. Por Ejemplo: $http_get_vars[ infopersonal ], $http_post_vars[ leidos ]. Cual es el estilo que debemos escoger? Continuaremos con la próxima entrega