Scribd Logo
Upload

Welcome to Scribd!

  • Guia 4 Formularios I

    Uploaded by

    dantenocturno
    23 views3 pages
    formul

    Copyright

    © © All Rights Reserved

    Available Formats

    PDF, TXT or read online from Scribd

    Did you find this document useful?

    Is this content inappropriate?

    Report this Document
    formul

    Copyright:

    © All Rights Reserved
    Download as PDF, TXT or read online from Scribd
    Flag for inappropriate content
    23 views3 pages

    Guia 4 Formularios I

    Uploaded by

    dantenocturno
    formul

    Copyright:

    © All Rights Reserved
    Download as PDF, TXT or read online from Scribd
    Flag for inappropriate content
    of 3

    Guas HTML

    2012

    GUIA 5. Formularios parte 1


    Doctype
    Hasta ahora no hemos hablado de un concepto de vital importancia que es la utilizacin de
    elementos HTML estndares.
    La organizacin que define los estndares para la web es W3C.
    Utilizar en lo posible las directivas de este comit de estndares nos traer como ventaja que
    nuestras pginas en un futuro sigan vindose correctamente en las nuevas versiones de
    navegadores.
    Antes de la etiqueta HTML se declara
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
    "http://www.w3.org/TR/html4/strict.dtd">

    Meta
    El HTML permite a los autores especificar metadatos (Informacin sobre un documento ms
    que contenido del propio documento).
    Por ejemplo, la siguiente declaracin establece un valor para la propiedad Author:
    <META name="Author" content="Dave Raggett">
    La codificacin UTF-8 corresponde a un juego de caracteres universales, contiene signos de la
    mayora de los lenguajes del mundo. Meta indispensable para solucionar problemas con
    caracteres ilegibles en la paginas web.
    <meta http-equiv="content-type" content="text/html; charset=utf-8" />

    Formulario - <form>
    Un formulario permite que el visitante al sitio cargue datos y sean enviados al servidor.
    Es el medio ideal para registrar comentarios del visitante sobre el sitio, solicitar productos,
    sacar turnos etc.
    De todos modos veremos que el lenguaje HTML solo tiene el objetivo de crear el formulario.
    El HTML no tiene la responsabilidad de registrar los datos en el servidor, esta acti vidad est
    delegada a un lenguaje que se ejecute en el servidor (PHP, ASP, ASP.Net, JSP etc.)
    Confeccionaremos un formulario para el ingreso de nuestro nombre y un botn para el envo
    del dato ingresado al servidor: <form></form>
    <html>
    <head>
    <title>Prueba de formulario</title>
    </head>
    <body>
    <form action="/registrardatos.php" method="post"> //especifica pagina que procesa info.
    Ingrese su nombre:
    <input type="text" name="nombre" size="20">
    // Crea una caja de texto
    <br>

    Gua 1 HTML. Elaborada por: Daniel Mora

    Guas HTML

    2012
    <input type="submit" value="enviar">
    </form>
    </body>
    </html>

    // Crea botn de envi de info.

    La propiedad action se inicializa con el nombre de la pgina que procesar los datos en el
    servidor. Como no conocemos la sintaxis de un lenguaje de servidor almacen en la raz de
    este sitio una pgina codificada en PHP que recibe los datos del formulario y los imprime en
    una nueva pgina
    Para inicializar un elemento con un valor, especificar la propiedad value=?
    Mas elementos de formulario:
    <input type="password" name="clave" size="12">
    password
    <input type="reset" value="borrar">

    //caja de texto con caracteres de

    // Crea boton para limpiar form, va al fina l

    <textarea name="comentarios" rows="5" cols="60"></textarea> // amplia para


    comentarios
    El elemento checkbox es otro control que se puede insertar en un formulario. Un
    checkbox es una casilla de seleccin que puede tomar dos valores (seleccionado/no
    seleccionado). Se pueden seleccionar varios.
    <input
    <input
    <input
    <input

    type="checkbox"
    type="checkbox"
    type="checkbox"
    type="checkbox"

    name="java">Java<br>
    name="cmasmas">C++<br> //Crea cuadro checkbox
    name="c">C<br>
    name="csharp">C#<br>

    Cuando tenemos un conjunto de opciones pero solo una puede ser seleccionada
    debemos emplear controles visuales de tipo radio. Todos tienen el mismo name.
    <input type="radio"
    estudios<br>
    <input type="radio"
    <input type="radio"
    <input type="radio"

    name="estudios" value="1">Sin
    name="estudios" value="2">Primario<br>
    name="estudios" value="3">Secundario<br>
    name="estudios" value="4">Universitario<br>

    El elemento select es un cuadro de seleccin.


    Este elemento HTML nos permite seleccionar una opcin entre un conjunto. Veremos
    en el concepto prximo que segn como la configuramos podemos seleccionar varias
    opciones.
    <select name="pais">
    <option value="1">Argentina</option>
    <option value="2">Espaa</option>
    <option value="3">Mxico</option>
    </select>
    Select (agrupamiento de opciones)
    <select name="articulo">
    <optgroup label="Frutas">
    <option value="1">Naranjas</option>
    <option value="2">Manzanas</option>
    <option value="3>Sandia</option>

    Gua 1 HTML. Elaborada por: Daniel Mora

    Guas HTML

    2012
    <option value="4">Frutilla</option>
    <option value="5">Durazno</option>
    <option value="6">Ciruela</option>
    </optgroup>
    <optgroup label="Verduras">
    <option value="7">Lechuga</option>
    <option value="8">Acelga</option>
    <option value="9">Zapallo</option>
    <option value="10">Papas</option>
    <option value="11">Batatas</option>
    <option value="13">Zanahorias</option>
    <option value="14">Rabanitos</option>
    <option value="15">Calabaza</option>
    </optgroup>
    </select>

    Ejercicios
    1. Confeccionar un formulario que solicite el ingreso del nombre de una persona y su
    edad. Luego llamar a la pgina "/registrardatos.html" para que imprima en pantalla
    los valores ingresados. Disponer un botn de tipo submit para el envo de los datos.
    (La pagina registrardatos.html no procesa informacin, solo es informativa)
    2. Confeccionar un formulario que solicite el ingreso de mail de una persona y luego
    pida el ingreso de su clave dos veces (recordar inicializar la propiedad name del
    elemento input con distintos nombres para cada control)
    3. Confeccionar un formulario que permita ingresar el nombre de una persona, su mail,
    su cc y finalmente su curriculum (este ltimo dato hacerlo utilizando un textarea).
    4. Confeccione un formulario que solicite el ingreso de un mail, una clave y luego
    muestre una serie de ttulos de pelculas con su respectivo checkbox. Disponer
    tambin del botn de tipo submit para el envo de datos al servidor.
    5. Confeccionar un formulario que solicite cual sistema operativo utiliza ms (linux o
    window).
    6. Confeccionar un formulario que solicite el ingreso del nombre de una persona y
    permita votar el sitio. Mediante un cuadro de seleccin el visitante puede elegir entre
    las siguientes opciones: Excelente, Muy Bueno, Bueno, Regular y Malo.
    7. Confeccione un control de tipo select con los nombres de pases de Amrica y Europa.
    Agrupe los pases por continente.
    8. Crear una pagina donde aplique todos los controles vistos. Ejemplo(Registro, reservas,
    compras etc)

    Gua 1 HTML. Elaborada por: Daniel Mora

    You might also like