INPUT Y SELECT EN HTML

INPUT Y SELECT EN HTML

1. INPUT

   • La etiqueta <input> se utiliza para el ingreso de datos por parte del usuario. El campo del input dependerá del tipo de control que le asignemos al atributo type.
     • text
       • entrada de texto de una línea
     • password
       • entrada de texto de una línea
     • checkbox
       • casilla de verificació
     • radio
       • radiobotón
     • submit
       • botón de envio
     • image
       • botón de envio gráfico o mapa de imágenes
     • reset
       • botón de reinicialización
     • button
       • botón pulsador
     • hidden
       • control oculto
     • file
       • selección de archivo

2. SELECT

   • Este elemento se utiliza para presentar al usuario varias opciones y que elija entre ellas una o más.
     • La forma general es:
       • <SELECT NAME="nombre" SIZE="num" MULTIPLE> <OPTION VALUE="valor_asociado_A" SELECTED>Opción A <OPTION VALUE="valor_asociado_B" >Opción B <OPTION VALUE="valor_asociado_C" >Opción C </SELECT>
       • Los atributos de SELECT permiten especificar el nombre lógico al que se asociará la opción elegida de entre las posibles. Sólo serán visibles las que se especifiquen en SIZE. Si es 1, el elemento selección tendrá la apariencia de un menú desplegable (cuidado con el número de opciones, pues podría desbordar la pantalla). Normalmente, el elemento selección permite seleccionar sólo una de sus opciones, pero con MULTIPLE podremos hacer que la selección afecte a varios de sus elementos.
       • Las opciones se especifícan con la etiqueta OPTION que puede aparecer con un atributo VALUE que indica el valor que se asociará al elemento de selección en caso de que esa opción sea la elegida. Este atributo puede obviarse, en cuyo caso el valor devuelto será la descripción de la opción misma. Se puede especificar con SELECTED la opción seleccionada por defecto.
       • Ejemplo
         • <html> <head> <title>Formulario</title> </head> <body> <form action="hobbie.php" method="get"> Elija su pasatiempo favorito: <select name="pasa"> <option value="tv">TV</option> <option value="libros">Libros</option> <option value="musica">Música</option> <option value="cine">Cine</option> <option value="teatro">Teatro</option> <option value="caminar">Caminar</option> <option value="otros">Otros</option> </select> </form> <p>La etiqueta <b>select</b> define un menú desplegable.<br> La etiqueta <b>option</b> define una opción dentro del menú desplegable y el atributo <b>value</b> especifica el valor incial del control.</p> </body> </html>