Formularios en html
23
FORMULARIOS EN HTML ¿Qué son los formularios? ¿Cómo se hacen?
-
Upload
yarelokas-ramos -
Category
Education
-
view
275 -
download
2
description
:)
Transcript of Formularios en html
FORMULARIOS EN HTML
¿Qué son los formularios? ¿Cómo se hacen?
¿Qué son formularios?
Una herramienta que hace posible obtener datos de algo en específico.
En internet los formularios recolectan información online con interacción del usuario para ejecutar una acción.
Que son que?
¿Cómo se hacen los formularios? Para definir los elementos interactivos
hay cinco etiquetas que junto con atributos y modificadores indican como recolectar información y manejarla después de recolectada.
Cálmate! No es tan difícil una vez que lo entiendes y lo pones en práctica :D
Etiqueta <FORM>
Todo formulario debe estar encerrado entre las etiquetas <FORM> y </FORM> que a su vez debe ubicarse entre el <BODY> y </BODY> del documento HTML. Esta etiqueta <FORM> presenta tres atributos posibles:Comando
Descripción
ACTION
El valor de este parámetro es la URL del programa o guión en el Servidor Web utilizado para procesar la información recolectada.
Comando
Descripción
METHOD
Puede asumir el valor GET o el valor POST, y definen la manera en la cual los datos son transferidos al servidor.
Etiqueta <FORM>
El valor GET:Todas las variables se enviarán por la dirección HTML. Ósea que los datos guardados aparecen en la barra de direcciones
NO PUEDO!!
El valor POST:Básicamente envía las variables de forma “oculta” para que nadie pueda ver los datos que ha enviado al pulsar el botón de envío de formulario.
Etiqueta <FORM>
<form action=”url” method=”post”>…</form>
<form action=”url” method=”get”>…</form>
Qué es eso?
Comando
Descripción
ENCTYPE
Éste atributo está reservado para que la información viaje en forma encriptado a través de Internet.
Etiqueta <FORM>
El atributo o parámetro ENCTYPE es optativo y no es realmente importante.
YEAH!!
Etiqueta <INPUT> Se la puede definir como una etiqueta
multifunción, ya que con la misma podemos crear "push buttons", "radio buttons", "check boxes", y simples recuadros para ingresar texto.
Posee ocho posibles parámetros: ALIGN, CHECKED, MAXLENGTH, NAME, SIZE, SRC, TYPE, y VALUE.
Que RAYOS!!
Pero no se asusten! Los atributos cruciales para toda etiqueta <INPUT> son:
NAME: que asocia un nombre con cada variable ingresada.
TYPE: que puede asumir los valores TEXT, PASSWORD, CHECKBOX, RADIO, SUBMIT, RESET, IMAGE y HIDDEN
Etiqueta <INPUT>
No te atragantes!!
Todo de acuerdo al tipo de elemento que queramos representar.
Etiqueta <INPUT>
<form action=”url” method=”post”>
<INPUT NAME="nombre" MAXLENGTH="25" TYPE="TEXT" VALUE="">Ó<INPUT NAME="boton" TYPE="SUBMIT" VALUE="Enviar">
</form>
Etiqueta <SELECT>
Este par de etiquetas define una lista de elementos de los cuales el usuario debe seleccionar uno o varios, de acuerdo a los atributos que especifiquemos.
Etiqueta <OPTION>
Con esta etiqueta definimos cada elemento de las listas designadas con el par <SELECT> y </SELECT>.
Etiqueta <TEXTAREA>
Este par de etiquetas nos permiten definir un area de dimensiones arbitrarias que funciona como una suerte de editor, donde el usuario puede ingresar texto.
Controlamos el tamaño del area de texto con los parámetros ROWS y COLS
¿Cómo construir un formulario? Un formulario siempre debe llevar el
atributo NAME para poder identificar el nombre de la variable que se alojará.
<FORM><INPUT TYPE="text" NAME="nombre"></FORM>
También se le puede dar un valor predeterminado
<FORM><INPUT TYPE="text" NAME="nombre" VALUE="J.J. Lopez"></FORM>
Los atributos SIZE se puede aplicar tamaño al formulario, si no se especifica por defecto se aplicara tamaño 20.
Con MAXLENGTH se aplica el limite de caracteres.
¿Cómo construir un formulario?
<FORM><INPUT TYPE="text" NAME="nombre" SIZE=30 MAXLENGTH=15></FORM>
Radio Buttons y Check Boxes Los Radio Buttons le permiten al usuario
seleccionar una entre varias opciones. En cambio las Check Boxes le dan la posibilidad de elegir una o más opciones.
Radio Buttons
<FORM><INPUT TYPE="radio" NAME="equipos" VALUE="cuervo">San Lorenzo<BR><INPUT TYPE="radio" NAME="equipos" VALUE="gallina">River Plate<BR><INPUT TYPE="radio" NAME="equipos" VALUE="bostero">Boca Juniors</FORM>
Con el atributo CHECKED le indicamos al navegador cual de todas las opciones debe aparecer marcada por defecto.
Radio Buttons
<FORM> ¿Quién será el campeón del torneo argentino?<BR><BR><INPUT TYPE="radio" NAME="equipos" VALUE="cuervo" CHECKED>San Lorenzo…</FORM>
Check Boxes
<FORM><INPUT TYPE="checkbox" NAME="cuervo" VALUE="YES">San Lorenzo…</FORM>
Es DEMACIADO!!
Listas en Formularios
Utilizamos la etiqueta <SELECT> en lugar de la utilizada anteriormente <INPUT> que a diferencia debe ser cerrada con su para </SELECT>.
<FORM><SELECT NAME="equipos"> <OPTION VALUE="cuervo">San Lorenzo <OPTION VALUE="gallina">River Plate <OPTION VALUE="bostero">Boca Juniors<OPTION VALUE="rojo">Independiente <OPTION VALUE="academia">Racing Club</SELECT> </FORM>
Botones SUBMIT y RESET
Este tipo de boton envía la información (SUBMIT). Mientras que el RESET lo que hace es borrar las modificaciones realizadas por el usuario y regresar todos los valores por defecto. Se puede cambiar el texto de los botones con VALUE.
<FORM> <INPUT TYPE="submit" VALUE="Enviar Datos"> <INPUT TYPE="reset" VALUE="Borrar Datos"> </FORM>
No es difícil O SI?
La buena noticia??
Terminamos!
