FORMULARIOS ENHTML   ¿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 ...
¿Cómo se hacen losformularios?   Para definir los elementos interactivos hay    cinco etiquetas que junto con atributos y...
Etiqueta <FORM>   Todo formulario debe estar encerrado entre las    etiquetas <FORM> y </FORM> que a su vez    debe ubica...
Etiqueta <FORM>Comando Descripción            Puede asumir el valor            GET o el valor POST, yMETHOD      definen l...
Etiqueta <FORM>   El valor POST:    Básicamente envía las variables de forma    “oculta” para que nadie pueda ver los dat...
Etiqueta <FORM>Comando Descripción                                   El atributo o       Éste atributo está       reserva...
Etiqueta <INPUT>   Se la puede definir como una etiqueta multifunción,    ya que con la misma podemos crear "push    butt...
Etiqueta <INPUT>   Pero no se asusten! Los    atributos cruciales para toda    etiqueta <INPUT> son: NAME: que asocia un...
Etiqueta <INPUT>Todo de acuerdo al tipo de elemento que queramos  representar.   <form action=”url” method=”post”>   <INPU...
Etiqueta <SELECT>   Este par de etiquetas    define una lista de    elementos de los    cuales el usuario debe    selecci...
Etiqueta <OPTION>   Con esta etiqueta definimos cada elemento de    las listas designadas con el par <SELECT> y    </SELE...
Etiqueta <TEXTAREA>   Este par de etiquetas nos permiten definir un    area de dimensiones arbitrarias que funciona    co...
¿Cómo construir unformulario?   Un formulario siempre debe llevar el atributo    NAME para poder identificar el nombre de...
¿Cómo construir unformulario?   Los atributos SIZE se puede aplicar tamaño al    formulario, si no se especifica por defe...
Radio Buttons y Check Boxes   Los Radio Buttons le permiten al usuario    seleccionar una entre varias opciones. En    ca...
Radio Buttons<FORM><INPUT TYPE="radio" NAME="equipos" VALUE="cuervo">San Lorenzo<BR><INPUT TYPE="radio" NAME="equipos" VAL...
Radio Buttons     Con el atributo CHECKED le indicamos al      navegador cual de todas las opciones debe      aparecer ma...
Check Boxes<FORM><INPUT TYPE="checkbox"NAME="cuervo" VALUE="YES">SanLorenzo…</FORM>                                Es     ...
Listas en Formularios   Utilizamos la etiqueta <SELECT> en lugar de    la utilizada anteriormente <INPUT> que a    difere...
Botones SUBMIT y RESET    <FORM>    <INPUT TYPE="submit" VALUE="Enviar Datos">    <INPUT TYPE="reset" VALUE="Borrar Datos"...
Formularios en html
Formularios en html
Próxima SlideShare
Cargando en…5
×

Formularios en html

403 visualizaciones

Publicado el

:)

Publicado en: Educación
0 comentarios
0 recomendaciones
Estadísticas
Notas
  • Sé el primero en comentar

  • Sé el primero en recomendar esto

Sin descargas
Visualizaciones
Visualizaciones totales
403
En SlideShare
0
De insertados
0
Número de insertados
1
Acciones
Compartido
0
Descargas
20
Comentarios
0
Recomendaciones
0
Insertados 0
No insertados

No hay notas en la diapositiva.

Formularios en html

  1. 1. FORMULARIOS ENHTML ¿Qué son los formularios? ¿Cómo se hacen?
  2. 2. ¿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 sonque?
  3. 3. ¿Cómo se hacen losformularios? 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
  4. 4. 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 El valor de este parámetro es la URL del programa o guión ACTION en el Servidor Web utilizado para procesar la información
  5. 5. Etiqueta <FORM>Comando Descripción Puede asumir el valor GET o el valor POST, yMETHOD definen la manera en la cual los datos son transferidos al servidor. El valor GET: NO PUEDO!! Todas las variables se enviarán por la dirección HTML. Ósea que los datos guardados aparecen en la barra de direcciones
  6. 6. Etiqueta <FORM> 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. <form action=”url” method=”post”>…</form> <form action=”url” method=”get”>…</form> Qué es eso?
  7. 7. Etiqueta <FORM>Comando Descripción  El atributo o Éste atributo está reservado para que la parámetroENCTYPE información viaje en ENCTYPE es forma encriptado a optativo y no es través de Internet. realmente importante. YEAH!!
  8. 8. 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!!
  9. 9. Etiqueta <INPUT> 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 No te valores TEXT, PASSWORD, atragantes!! CHECKBOX, RADIO, SUBMIT, RESET, IMAGE y HIDDEN
  10. 10. Etiqueta <INPUT>Todo de acuerdo al tipo de elemento que queramos representar. <form action=”url” method=”post”> <INPUT NAME="nombre" MAXLENGTH="25" TYPE="TEXT" VALUE=""> Ó <INPUT NAME="boton" TYPE="SUBMIT" VALUE="Enviar"> </form>
  11. 11. 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.
  12. 12. Etiqueta <OPTION> Con esta etiqueta definimos cada elemento de las listas designadas con el par <SELECT> y </SELECT>.
  13. 13. 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 eltamaño del area detexto con losparámetros ROWS yCOLS
  14. 14. ¿Cómo construir unformulario? 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>
  15. 15. ¿Cómo construir unformulario? 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. <FORM> <INPUT TYPE="text" NAME="nombre" SIZE=30 MAXLENGTH=15> </FORM>
  16. 16. 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.
  17. 17. Radio Buttons<FORM><INPUT TYPE="radio" NAME="equipos" VALUE="cuervo">San Lorenzo<BR><INPUT TYPE="radio" NAME="equipos" VALUE="gallina">RiverPlate<BR><INPUT TYPE="radio" NAME="equipos" VALUE="bostero">BocaJuniors</FORM>
  18. 18. Radio Buttons  Con el atributo CHECKED le indicamos al navegador cual de todas las opciones debe aparecer marcada por defecto.<FORM>¿Quién será el campeón del torneoargentino?<BR><BR><INPUT TYPE="radio" NAME="equipos"VALUE="cuervo" CHECKED>SanLorenzo…</FORM>
  19. 19. Check Boxes<FORM><INPUT TYPE="checkbox"NAME="cuervo" VALUE="YES">SanLorenzo…</FORM> Es DEMACIADO!!
  20. 20. 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">BocaJuniors<OPTION VALUE="rojo">Independiente<OPTION VALUE="academia">RacingClub</SELECT></FORM>
  21. 21. Botones SUBMIT y RESET <FORM> <INPUT TYPE="submit" VALUE="Enviar Datos"> <INPUT TYPE="reset" VALUE="Borrar Datos"> </FORM> 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.

×