FORMULARIOS
Los Formularios son elementos Web que permiten al usuario insertar datos en una página que luego serán utilizados por la página Web. Por ejemplo, un formulario de registro de usuario o un login de usuario.
La etiqueta que define un formulario es "<form ...> ... </form>" y tiene los siguientos parámetros útiles:
* action="registrar.php" : es la dirección de la página Web que va a recoger los datos enviados en el formulario.
* method="GET" // "POST" : selecciona el método que se empleará para enviar los datos a la página Web de destino. El método GET envía los datos a traves de la URL mientras que el método POST crea datos invisibles que se envían de una página a la otra.
Pero la etiqueta "<form>...</form>" solo define el formulario y los tipos de datos que se pueden insertar en él se escriben como estas etiquetas:
* BOTONES : se pueden usar para enviar los datos de un formulario o para combinarlos con Javascript y crear efectos con ellos. Un ejemplo de ambos usos:
Código: Seleccionar todo
Boton de envio de formulario
<input type="submit" value="Texto del boton"> ---- Sin etiqueta de cierre
Boton normal
<input type="button" value="Texto del boton"> --- Sin etiqueta de cierre
* CASILLAS DE VERIFICACIÓN : son los elementos que permiten activar o no una opción concreta haciendo click en un cuadro blanco que contiene una marca (o no). Usan tambien la etiqueta INPUT de la siguiente manera:
Código: Seleccionar todo
<input type="checkbox" name="nombreDelControl" checked> --- checked indica si está activado por defecto o no.
* RADIO BOTONES : son los elementos que permiten elegir una de varias opciones, normalmente como circulos blancos que se activan con un punto negro en su interior. Usan la etiqueta INPUT de la siguiente manera:
Código: Seleccionar todo
<input type="radio" name="nombreDelControl" checked> --- igual que en "checkbox"
* MENUES : en este tipo de controles, se puede elegir una de las varias opciones que aparecen en el menú despleglable. La forma de hacer un menú es la de siguiente manera:
Código: Seleccionar todo
<SELECT name="nombreDelMenu">
<OPTION label="etiquetaOPCION" value="valorDeLaOpcion" selected>Texto de la opcion</OPTION> --- selected marca la opción por defecto
<OPTGROUP label="Etiqueta de submenu"> --- esto permite crear agrupaciones de opciones
<OPTION label="etiquetaOPCION" value="valorDeLaOpcion">Texto de la opcion</OPTION>
<OPTION label="etiquetaOPCION2" value="valorDeLaOpcion2">Texto de la opcion2</OPTION>
</OPTGROUP>
</SELECT>
* CONTROLES OCULTOS : los controles ocultos son útiles para enviar información que el usuario no necesita ver, pero sin embargo es información útil para la página que recoge los datos del formulario. Para enviar un dato oculto, se hace con el siguiente uso de la etiqueta INPUT:
Código: Seleccionar todo
<input type="hidden" name="nombreControl" value="valorDelControl">
* TEXTO : el texto es la forma de entrada de datos más básica. Se pueden insertar tres tipos de textos : texto corto normal, texto corto como contraseña y texto de varias lineas. Se explica el uso de cada uno de ellas en este ejemplo:
Código: Seleccionar todo
Cuadro de texto de varias lineas
<textarea name="nombreCuadroVariasLineas" rows=5 cols=40></textarea> --- rows=filas, cols=columnas
Cuadro de texto simple
<input type="text" name="nombreTexto"> --- sin etiqueta de cierre
Cuadro de contraseña
<input type="password" name="nombreContraseña"> --- sin etiqueta de cierre
* SELECCIONAR ARCHIVO : a veces nos interesa que el usuario pueda enviar archivos a la página Web, y se hace siguiendo este uso de la etiqueta INPUT: