XHTML

 

Formularios

La etiqueta FORM

En XHTML, los formularios se especifican con el elemento <form> . Un ejemplo:

<form action="paginaQueTrataLosDatos.php" method="post" 

enctype="application/x-www-form-urlencoded">

   los controles del formulario 

</form>

El atributo action

El atributo action es requerido para que el formulario envíe los datos a la dirección web de la aplicación web que procese el set de datos del formulario.

El methodo de envío

El atributo meted determina que método http será utilizado para enviar los hacia la aplicación de servidor que procesará el set de datos. Hay dos posibles valores para usar:

El atributo enctype

El atributo enctype especifica como el set de datos será re-codificado para el envío. Se suelen utilizar las siguientes codificacinnes:

application/x-www-form-urlencoded
La codificación por defecto
multipart/form-data
Cuando el formumario tiene un control para seleccionar un archivo.
text/plain
Cuando enviamos el correo al cliente de correo electrónico .

Controles básicos

La mayoria de los controles de un formulario se definen mediante la etiqueta <input>. El atributo type permite elegir el tipo de control deseado. Para un campo de texto simple utilizaremos el valor type="text":

<input type="text" id="unIdentificador" name="edad" />

El atributo Type

El atributo type permite elegir el tipo de control deseado

text
Campo de texto
hidden
Campo oculto
password
Campo de contraseña
button
Un botón
submit
Botón para enviar el formulario
reset
Botón para resetear el formulario
checkbox
Casilla de verificación
radio
Botón de opción
file
Selector de archivo
image
Detector de posición en una imagen

El atributo name

El valor introducido por el usuario en un control es una variable. Para tratar correctament una variable es necesario nombrarla con el atributo name.

El atributo id

El atributo id permite especificar un identificador para el elemento. En XHTML todas las etiquetas pueden tener un identificador y es menester que todos los identificadores de una misma página sean distintos.

Etiquetar campos

La etiqueta <label> se usa para especificar los títulos (etiquetas) de los controles. El atributo for permite relacionar un título(etiqueta) con un control. Basta con indicar como valor del atributo for es la id del control
al que queremos hacer referencia.

<label for="unIdentificador">Edad</label>

<input type="text" id="unIdentificador" name="edad">

La etiqueta FIELDSET

Elemento <fieldset> es un elemento de bloque, que sirve para agrupar controles de un formulario, la etiqueta <fieldset> requiere de otra etiqueta necesaria para su correcto funcionamiento y es la etiqueta <legend>. Un ejemplo:

<fieldset>

  <legend>Datos personales</legend>
<input type="text" id="nombre" name="nombre" />
<input type="text" id="apellidos" name="apellidos" />
</fieldset>

Areas de texto

Para añadir una area de texto multilínea:

<textarea name="observaciones"></textarea>

Listas desplegable

Para añadir un lista desplegable se utilizan dos etiquetas <select> y <option>. La etiqueta

<select>

<option value="1">Inglés</option>
<option value="2" selected="selected">Castellano</option> </select>

Para agrupar las opciones se utiliza la etiqueta <optgroup>

<select>

  <optgroup label="Europa">

    <option value="1">Francía</option>
<option value="2" selected="selected">España</option> </optgroup> <optgroup label="Asía"> <option value="3">Japón</option>
<option value="4">Indía</option> </optgroup> </select>