Nota: Este documento es parte de una traducción al castellano de la Recomendación del W3C "HTML 4.01 Specification" (más información). Puede consultar laversión original del mismo. Para cualquier comentario o corrección acerca de la traducción póngase en contacto con el traductor en jrpozoarroba conclase punto net. Gracias por su colaboración.

Véase elAviso de copyright de la traducción.

Contenidos

1. Introducción a los formularios
2. Controles
   1. Tipos de controles
3. El elementoFORM
4. El elementoINPUT
   1. Tipos de controles creados con INPUT
   2. Ejemplos de formularios con controles INPUT
5. El elementoBUTTON
6. Los elementosSELECT,OPTGROUP yOPTION
   1. Opciones preseleccionadas
7. El elementoTEXTAREA
8. El elementoISINDEX
9. Rótulos
   1. El elementoLABEL
10. Añadir estructura a los formularios: los elementosFIELDSET yLEGEND
11. Dirigir el foco hacia un elemento
    1. Navegación con tabulador
    2. Teclas de acceso
12. Controles deshabilitados y de sólo lectura
    1. Controles deshabilitados
    2. Controles de sólo lectura
13. Envío de formularios
    1. Método de envío del formulario
    2. Controles con éxito
    3. Procesamiento de los datos del formulario
       • Paso uno: Identificación de los controles con éxito
       • Paso dos: Construcción del conjunto de datos del formulario
       • Paso tres: Codificación del conjunto de datos del formulario
       • Paso cuatro: Envío del conjunto de datos del formulario codificado
    4. Tipos de contenido de formularios
       • application/x-www-form-urlencoded
       • multipart/form-data

Aquí se muestra un ejemplo de un formulario simple que incluye rótulos, radiobotones y botones para reinicializar el formulario o para enviarlo:

 <FORM action="http://algunsitio.com/prog/usuarionuevo" method="post">    <P>    <LABEL for="nombre">Nombre: </LABEL>              <INPUT type="text"><BR>    <LABEL for="apellido">Apellido: </LABEL>              <INPUT type="text"><BR>    <LABEL for="email">email: </LABEL>              <INPUT type="text"><BR>    <INPUT type="radio" name="sexo" value="Varón"> Varón<BR>    <INPUT type="radio" name="sexo" value="Mujer"> Mujer<BR>    <INPUT type="submit" value="Enviar"> <INPUT type="reset">    </P> </FORM>

Nota. Esta especificación incluye información más detallada sobre formulariosen las subsecciones sobrerepresentación deformularios.

<!ELEMENTFORM - - (%block;|SCRIPT)+ -(FORM) -- formulario interactivo --><!ATTLIST FORM%attrs;                              --%coreattrs,%i18n,%events --action%URI;          #REQUIRED -- procesador del formulario en el servidor --method      (GET|POST)     GET       -- método HTTP usado para enviar formulario --enctype%ContentType;  "application/x-www-form-urlencoded"accept%ContentTypes; #IMPLIED  -- lista de tipos MIME para subir ficheros --nameCDATA          #IMPLIED  -- nombre del formulario para los scripts --onsubmit%Script;       #IMPLIED  -- el formulario fue enviado --onreset%Script;       #IMPLIED  -- el formulario fue reinicializado --accept-charset%Charsets;  #IMPLIED  -- lista de codif. de caracteres soportadas --  >

Definiciones de atributos

action =uri[CT]

Este atributo especifica un agente procesador de formularios. El comportamiento del agente de usuario frente a un valor diferente de un URI HTTP es indefinido.

method =get|post[CI]

Este atributo especifica qué método HTTP se usará para enviar elconjunto de datos del formulario. Los valores posibles (que no distinguen entre mayúsculas y minúsculas) son "get" (valor por defecto) y "post". Véase la sección sobreenvío de formularios para información sobre su uso.

enctype =tipo de contenido[CI]

Este atributo especifica eltipo de contenido usado para enviar el formulario al servidor (cuando el valor del atributomethod sea "post"). El valor por defecto de este atributo es"application/x-www-form-urlencoded". El valor"multipart/form-data" debería usarse en combinación con el elementoINPUT,type="file".

accept-charset =lista de codificaciones de caracteres[CI]

Este atributo especifica la lista decodificaciones de caracteres para los datos introducidos que son aceptadas por el servidor que procesa este formulario. El valor es una lista de valores decodificaciones de caracteres separadas por espacios y/o comas. El cliente debe interpretar esta lista como una lista o-exclusiva, es decir, el servidor es capaz de aceptar cualquier codificación de caracteres individual por entidad recibida.

El valor por defecto de este atributo es la cadena reservada "UNKNOWN" ("desconocido"). Los agentes de usuario pueden interpretar este valor como la codificación de caracteres que fue usada para transmitir el documento que contiene este elementoFORM.

accept =lista de tipos de contenido[CI]

Este atributo especifica una lista de tipos de contenido separados por comas que un servidor procesador de formularios manejará correctamente. Los agentes de usuario pueden utilizar esta información para filtrar ficheros no conformes cuando pidan al usuario seleccionar ficheros para enviar al servidor (véase el elementoINPUT cuandotype="file").

name =cdata[CI]

Este atributo da nombre al elemento de modo que se pueda hacer referencia a él desde hojas de estilo o scripts.Nota. Este atributo ha sido incluido por motivos de compatibilidad con versiones anteriores. Las aplicaciones deberían usar el atributoid para identificar elementos.

Atributos definidos en otros lugares

• id,class(identificadores a nivel de documento)
• lang(información sobre el idioma),dir(dirección del texto)
• style(información de estilo en línea)
• title(título del elemento)
• target (información del marco destino)
• onsubmit,onreset,onclick,ondblclick,onmousedown,onmouseup,onmouseover,onmousemove,onmouseout,onkeypress,onkeydown,onkeyup(eventos intrínsecos)

El siguiente ejemplo muestra un formulario que va a ser procesado por el programa "usuarionuevo"cuando sea enviado. El formulario será enviado al programa usando el método HTTP "post".

 <FORM action="http://algunsitio.com/prog/usuarionuevo" method="post">...contenidos del formulario... </FORM>

Nota. Quedan fuera del alcance de esta especificación las cuestiones sobre elcomportamiento de los servidores que reciben datos de formularios.

<!ENTITY % InputType  "(TEXT | PASSWORD | CHECKBOX |    RADIO | SUBMIT | RESET |    FILE | HIDDEN | IMAGE | BUTTON)"   ><!-- se requiere el atributo name para todos excepto para submit y reset --><!ELEMENTINPUT - O EMPTY              -- control de formulario --><!ATTLIST INPUT%attrs;                              --%coreattrs,%i18n,%events --type%InputType;    TEXT      -- qué tipo de control se necesita --nameCDATA          #IMPLIED  -- enviar como parte del formulario --valueCDATA          #IMPLIED  -- especificar para radiobotones                                          y casillas de verificación --checked     (checked)      #IMPLIED  -- para radiobotones y casillas de verif. --disabled    (disabled)     #IMPLIED  -- no disponible en este contexto --readonly    (readonly)     #IMPLIED  -- para texto y contraseñas --sizeCDATA          #IMPLIED  -- específico de cada tipo de campo --maxlengthNUMBER         #IMPLIED  -- máximo de caracteres para campos de texto --src%URI;          #IMPLIED  -- para campos con imágenes --altCDATA          #IMPLIED  -- descripción corta --usemap%URI;          #IMPLIED  -- usar mapa de imágenes en el cliente --ismap       (ismap)        #IMPLIED  -- usar mapa de imágenes en el servidor --tabindexNUMBER         #IMPLIED  -- posición en el orden de tabulación --accesskey%Character;    #IMPLIED  -- carácter de la tecla de accesibilidad --onfocus%Script;       #IMPLIED  -- el foco se dirigió hacia el elemento --onblur%Script;       #IMPLIED  -- el elemento perdió el foco --onselect%Script;       #IMPLIED  -- se seleccionó parte del texto --onchange%Script;       #IMPLIED  -- el valor del elemento fue modificado --accept%ContentTypes; #IMPLIED  -- lista de tipos MIME para subir ficheros --  >

Definiciones de atributos

type =text|password|checkbox|radio|submit|reset|file|hidden|image|button[CI]

Este atributo especifica eltipo de control a crear. El valor por defecto para este atributo es "text".

name =cdata[CI]

Este atributo asigna elnombre de control.

value =cdata[CA]

Este atributo especifica elvalor inicial delcontrol. Es opcional excepto cuando el atributotype tenga el valor "radio" o "checkbox".

size =cdata[CN]

Este atributo le dice al agente de usuario la anchura inicial del control. Laanchura viene dada enpíxeles excepto cuando el atributotype tenga el valor "text" o "password". En estos casos, el valorse refiere al número (entero) de caracteres.

maxlength =number[CN]

Cuando el atributotype tiene el valor "text" o "password",este atributo especifica el número máximo de caracteres que puede introducir el usuario.Este número puede exceder del especificado porsize, en cuyo caso el agentede usuario debería ofrecer un mecanismo de desplazamiento. El valor por defecto paraeste atributo es un número ilimitado.

checked[CI]

Cuando el atributotype tiene el valor "radio" o "checkbox",este atributo booleano especifica que el botón está marcado ("on"). Los agentes de usuario nodeben tener en cuenta este atributo para otros tipos de control.

src =uri[CT]

Cuando el atributotype tiene el valor "image", este atributo especificala localización de la imagen que debe usarse para decorar el botón gráfico de envío.

Atributos definidos en otros lugares

• id,class (identificadores a nivel de documento)
• lang (información sobre el idioma),dir (direccióndel texto)
• title (título delelemento)
• style (informaciónde estilo en línea)
• alt (texto alternativo)
• align (alineación)
• accept (tipos de contenidos legales paraun servidor)
• readonly (controles de entrada de sólo lectura)
• disabled (controles de entrada deshabilitados)
• tabindex (navegación con tabulador)
• accesskey (teclas de acceso)
• usemap (mapas de imágenes en el lado del cliente)
• ismap (mapas de imágenes en el lado del servidor)
• onfocus,onblur,onselect,onchange,onclick,ondblclick,onmousedown,onmouseup,onmouseover,onmousemove,onmouseout,onkeypress,onkeydown,onkeyup (eventos intrínsecos)

El siguiente fragmento HTML de ejemplo define un formulario simple que permite al usuariointroducir su nombre, apellido, dirección de correo electrónico y sexo. Cuando se activeel botón de envío, el formulario será enviado al programa especificado por elatributoaction.

 <FORM action="http://algunsitio.com/prog/usuarionuevo" method="post">    <P>    Nombre: <INPUT type="text" name="nombre"><BR>    Apellido: <INPUT type="text" name="apellido"><BR>    email: <INPUT type="text" name="email"><BR>    <INPUT type="radio" name="sexo" value="Varón"> Varón<BR>    <INPUT type="radio" name="sexo" value="Mujer"> Mujer<BR>    <INPUT type="submit" value="Enviar"> <INPUT type="reset">    </P> </FORM>

Este formulario podría ser representado de la siguiente manera:

En la sección sobre el elementoLABEL, se habla sobre la codificación de rótulos tales como "Nombre".

En el ejemplo que sigue, se ejecuta la función Javascript llamadaverificar cuandose da el evento "onclick":

<HEAD><META http-equiv="Content-Script-Type" content="text/javascript"></HEAD><BODY> <FORM action="..." method="post">    <P>    <INPUT type="button" value="Pínchame"> </FORM></BODY>

Consulte la sección sobreeventos intrínsecospara más información sobre scripts y eventos.

El siguiente ejemplo muestra cómo pueden enviarse los contenidos de un ficheroespecificado por el usuario con un formulario. Se le pide al usuario su nombrey una lista de nombres de ficheros cuyos contenidos deberían enviarse con elformulario. Al especificar paraenctype el valor "multipart/form-data", los contenidosde cada fichero se empaquetarán para su envío en una sección separada de un documentomultiparte.

<FORM action="http://servidor.com/cgi/procesar"    enctype="multipart/form-data"    method="post"> <P> ¿Cómo se llama usted? <INPUT type="text" name="nombre_del_remitente"> ¿Qué ficheros desea enviar? <INPUT type="file" name="nombre_de_los_ficheros"> </P></FORM>

<!ELEMENTBUTTON - -     (%flow;)* -(A|%formctrl;|FORM|FIELDSET)     -- botón pulsador --><!ATTLIST BUTTON%attrs;                              --%coreattrs,%i18n,%events --nameCDATA          #IMPLIEDvalueCDATA          #IMPLIED  -- se envía al servidor junto al formulario --type        (button|submit|reset) submit -- para usar como botón de formulario --disabled    (disabled)     #IMPLIED  -- no disponible en este contexto --tabindexNUMBER         #IMPLIED  -- posición en el orden de tabulación --accesskey%Character;    #IMPLIED  -- carácter de la tecla de accesibilidad --onfocus%Script;       #IMPLIED  -- el foco se dirigió hacia el elemento --onblur%Script;       #IMPLIED  -- el elemento perdió el foco --  >

Definiciones de atributos

name =cdata[CI]

Este atributo asigna elnombre de control.

value =cdata[CS]

Este atributo asigna al botón suvalor inicial.

type =submit|button|reset[CI]

Este atributo declara el tipo del botón. Valores posibles:

• submit: Crea unbotón de envío (submit button).Este es el valor por defecto.
• reset: Crea un botón de reinicialización (resetbutton).
• button: Crea unbotón pulsador (push button).

Atributos definidos en otros lugares

• id,class (identificadores a nivel de documento)
• lang (información sobre el idioma),dir (direccióndel texto)
• title (título delelemento)
• style (informaciónsobre el estilo en línea)
• disabled (controles de entrada deshabilitados)
• accesskey (teclasde acceso)
• tabindex (navegación con tabulador)
• onfocus,onblur,onclick,ondblclick,onmousedown,onmouseup,onmouseover,onmousemove,onmouseout,onkeypress,onkeydown,onkeyup (eventos intrínsecos)

El siguiente ejemplo extiende un ejemplo previo, pero creando los botones deenvío y dereinicialización conBUTTON en lugar de conINPUT. Los botones contienen imágenes sacadas de elementosIMG.

 <FORM action="http://algunsitio.com/prog/usuarionuevo" method="post">    <P>    Nombre: <INPUT type="text" name="nombre"><BR>    Apellido: <INPUT type="text" name="apellido"><BR>    email: <INPUT type="text" name="email"><BR>    <INPUT type="radio" name="sexo" value="Varón"> Varón<BR>    <INPUT type="radio" name="sexo" value="Mujer"> Mujer<BR>    <BUTTON name="enviar" value="enviar" type="submit">    Enviar<IMG src="/iconos/ahivaeso.gif" alt="¡Ahí va eso!"></BUTTON>    <BUTTON name="reiniciar" type="reset">    Reinicializar<IMG src="/iconos/ayno.gif" alt="¡Ay, no!"></BUTTON>    </P> </FORM>

EJEMPLO ILEGAL:
Lo siguiente no es HTML legal.

<BUTTON><IMG src="blabla.gif" usemap="..."></BUTTON>

<!ELEMENTSELECT - - (OPTGROUP|OPTION)+ -- selector de opciones --><!ATTLIST SELECT%attrs;                              --%coreattrs,%i18n,%events --nameCDATA          #IMPLIED  -- nombre del campo --sizeNUMBER         #IMPLIED  -- filas visibles --multiple    (multiple)     #IMPLIED  -- por defecto es selección simple --disabled    (disabled)     #IMPLIED  -- no disponible en este contexto --tabindexNUMBER         #IMPLIED  -- posición en el orden de tabulación --onfocus%Script;       #IMPLIED  -- el foco se dirigió hacia el elemento --onblur%Script;       #IMPLIED  -- el elemento perdió el foco --onchange%Script;       #IMPLIED  -- el valor del elemento fue modificado --  >

Definiciones de atributos de SELECT

name =cdata[CI]

Este atributo asigna elnombre de control.

size =número[CN]

Si un elementoSELECT se presenta como una lista con desplazamiento ("scrolled list box"),este atributo especifica el número de filas de la lista que deberían ser visibles almismo tiempo. No es preciso que los agentes visuales presenten un elementoSELECTcomo una lista ("list box"); pueden usar cualquier otro mecanismo, como por ejemplo unmenú desplegable ("drop-down menu").

multiple[CI]

Si está activado, este atributo booleano permite selecciones múltiples. Si noestá activado, el elementoSELECT sólo permite selecciones simples.

Atributos definidos en otros lugares

• id,class (identificadores a nivel de documento)
• lang (información sobre el idioma),dir (dirección deltexto)
• title (título delelemento)
• style (informaciónde estilo en línea)
• disabled (controles de entrada deshabilitados)
• tabindex (navegación con tabulador)
• onclick,ondblclick,onmousedown,onmouseup,onmouseover,onmousemove,onmouseout,onkeypress,onkeydown,onkeyup (eventos intrínsecos)

<!ELEMENTOPTGROUP - - (OPTION)+ -- grupo de opciones --><!ATTLIST OPTGROUP%attrs;                              --%coreattrs,%i18n,%events --disabled    (disabled)     #IMPLIED  -- no disponible en este contexto --label%Text;         #REQUIRED -- para usar en menúes jerárquicos --  >

Definiciones de atributos de OPTGROUP

label =texto[CS]

Este atributo especifica el rótulo del grupo de opciones.

Atributos definidos en otros lugares

• id,class (identificadores a nivel de documento)
• lang (información sobre el idioma),dir (dirección del texto)
• title (título del elemento)
• style (informaciónde estilo en línea)
• disabled (controles de entrada deshabilitados)
• onclick,ondblclick,onmousedown,onmouseup,onmouseover,onmousemove,onmouseout,onkeypress,onkeydown,onkeyup (eventos intrínsecos)

Nota. Se avisa a los implementadores de que las versiones futuras deHTML pueden extender el mecanismo de agrupamiento para permitir grupos anidados (es decir,para que los elementosOPTGROUP puedan anidarse). Esto permitirá a los autores representar una jerarquíade opciones más rica.

<!ELEMENTOPTION - O (#PCDATA)         -- opción seleccionable --><!ATTLIST OPTION%attrs;                              --%coreattrs,%i18n,%events --selected    (selected)     #IMPLIED  -- opción preseleccionada --disabled    (disabled)     #IMPLIED  -- no disponible en este contexto --label%Text;         #IMPLIED  -- para usar en menúes jerárquicos --valueCDATA          #IMPLIED  -- por defecto es el contenido del elemento --  >

Definiciones de atributos de OPTION

selected[CI]

Si está establecido, este atributo booleano especifica que esta opciónestá preseleccionada.

value =cdata[CS]

Este atributo especifica elvalor inicial delcontrol. Si este atributo no está establecido, elvalorinicial es igual a los contenidos del elementoOPTION.

label =texto[CS]

Este atributo permite a los autores especificar un rótulo para la opción máscorto que el contenido del elementoOPTION. Cuando esté especificado, los agentes de usuario deberían usarcomo rótulo de la opción el valor de este atributo en lugar del contenido del elementoOPTION.

Atributos definidos en otros lugares

• id,class (identificadores a nivel de documento)
• lang (información sobre el idioma),dir (dirección del texto)
• title (título del elemento)
• style (informaciónde estilo en línea)
• disabled (controles de entrada deshabilitados)
• onclick,ondblclick,onmousedown,onmouseup,onmouseover,onmousemove,onmouseout,onkeypress,onkeydown,onkeyup (eventos intrínsecos)

En este ejemplo, creamos un menú que permite al usuario seleccionar cuálde los siete componentes de un programa instalar. Los dos primeros componentesestán preseleccionados pero pueden ser deseleccionados por el usuario. El restode los componentes no están preseleccionados. El atributosize dice que el menú sólodebería tener cuatro filas, aunque el usuario pueda elegir ente siete opciones.Las otras opciones deberían estar disponibles a través de un mecanismo de desplazamiento.

El elementoSELECT va seguido de botones de envío y de reinicialización.

<FORM action="http://algunsitio.com/prog/elegir-componente" method="post">   <P>   <SELECT multiple size="4" name="elegir-componente">      <OPTION selected value="Componente_1_a">Componente_1</OPTION>      <OPTION selected value="Componente_1_b">Componente_2</OPTION>      <OPTION>Componente_3</OPTION>      <OPTION>Componente_4</OPTION>      <OPTION>Componente_5</OPTION>      <OPTION>Componente_6</OPTION>      <OPTION>Componente_7</OPTION>   </SELECT>   <INPUT type="submit" value="Enviar"><INPUT type="reset">   </P></FORM>

Solamente las opciones seleccionadastendrán éxito(usando elnombre de control "elegir-componente"). Cuandono haya opciones seleccionadas, el control no tendrá éxito, y ni el nombre ni ningunode los valores se enviarán al servidor cuando se envíe el formulario. Obsérvese queel atributovalue, cuando está establecido, determina elvalor inicial del control, que de otro modo es el contenidodel elemento.

En este ejemplo usamos el elementoOPTGROUP para agrupar opciones. El siguiente código:

<FORM action="http://algunsitio.com/prog/algunprograma" method="post"> <P> <SELECT name="ComOS">     <OPTION selected label="ninguno" value="ninguno">Ninguno</OPTION>     <OPTGROUP label="PortMaster 3">       <OPTION label="3.7.1" value="pm3_3.7.1">PortMaster 3 con ComOS 3.7.1</OPTION>       <OPTION label="3.7" value="pm3_3.7">PortMaster 3 con ComOS 3.7</OPTION>       <OPTION label="3.5" value="pm3_3.5">PortMaster 3 con ComOS 3.5</OPTION>     </OPTGROUP>     <OPTGROUP label="PortMaster 2">       <OPTION label="3.7" value="pm2_3.7">PortMaster 2 con ComOS 3.7</OPTION>       <OPTION label="3.5" value="pm2_3.5">PortMaster 2 con ComOS 3.5</OPTION>     </OPTGROUP>     <OPTGROUP label="IRX">       <OPTION label="3.7R" value="IRX_3.7R">IRX con ComOS 3.7R</OPTION>       <OPTION label="3.5R" value="IRX_3.5R">IRX con ComOS 3.5R</OPTION>     </OPTGROUP> </SELECT></FORM>

representa el siguiente agrupamiento:

  Ninguno  PortMaster 3      3.7.1      3.7      3.5  PortMaster 2      3.7      3.5  IRX      3.7R      3.5R

Los agentes de usuario visuales pueden permitir a losusuarios seleccionar de entre grupos de opciones a través de un menú jerárquico ode algún otro mecanismo que refleje la estructura de las opciones.

Un agente de usuario gráfico podría representarlo así:

Esta imagen muestra un elementoSELECT representado mediante menúes en cascada. El rótulo superiordel menú muestra el valor seleccionado actualmente (PortMaster 3, 3.7.1).El usuario ha desplegado dos menúes en cascada, pero aún no ha seleccionado el nuevo valor(PortMaster 2, 3.7). Obsérvese que cada menú en cascada muestra el rótulo de un elementoOPTGROUP uOPTION.

<!ELEMENTTEXTAREA - - (#PCDATA)       -- campo de texto multilínea --><!ATTLIST TEXTAREA%attrs;                              --%coreattrs,%i18n,%events --nameCDATA          #IMPLIEDrowsNUMBER         #REQUIREDcolsNUMBER         #REQUIREDdisabled    (disabled)     #IMPLIED  -- no disponible en este contexto --readonly    (readonly)     #IMPLIEDtabindexNUMBER         #IMPLIED  -- posición en el orden de tabulación --accesskey%Character;    #IMPLIED  -- carácter de la tecla de accessibilidad --onfocus%Script;       #IMPLIED  -- el foco se dirigió hacia el elemento --onblur%Script;       #IMPLIED  -- el elemento perdió el foco --onselect%Script;       #IMPLIED  -- se seleccionó parte del texto --onchange%Script;       #IMPLIED  -- el valor del elemento fue modificado --  >

Definiciones de atributos

name =cdata[CI]

Este atributo asigna elnombre de control.

rows =número[CN]

Este atributo especifica el número de líneas de texto visibles. Los usuariosdeberían poder introducir un número mayor de líneas, por lo que los agentes de usuario deberíanproporcionar medios para desplazar los contenidos del control cuandolos contenidos se extiendan más allá del área visible.

cols =número[CN]

Este atributo especifica la anchura visible en caracteres de anchura media.Los usuarios deberían poder introducir líneas de mayor longitud, por lo quelos agentes de usuario deberían proporcionar medios para desplazar loscontenidos del control cuando los contenidos se extiendan más allá del áreavisible. Los agentes del usuario pueden partir las líneas de texto visiblepara que las líneas largas puedan verse sin necesidad de desplazarlas.

Atributos definidos en otros lugares

• id,class (identificadores a nivel de documento)
• lang (información sobre el idioma),dir (dirección del texto)
• title (título del elemento)
• style (informaciónde estilo en línea)
• readonly (controles de entrada de sólo lectura)
• disabled (controles de entrada deshabilitados)
• tabindex (navegación con tabulador)
• onfocus,onblur,onselect,onchange,onclick,ondblclick,onmousedown,onmouseup,onmouseover,onmousemove,onmouseout,onkeypress,onkeydown,onkeyup (eventos intrínsecos)

Este ejemplo crea un controlTEXTAREA de 20 filas por 80 columnasque contiene inicialmente dos líneas de texto. El elementoTEXTAREA va seguido de botones de envío y reinicialización.

<FORM action="http://algunsitio.com/prog/leer-texto" method="post">   <P>   <TEXTAREA name="eltexto" rows="20" cols="80">   Primera línea del texto inicial.   Segunda línea del texto inicial.   </TEXTAREA>   <INPUT type="submit" value="Enviar"><INPUT type="reset">   </P></FORM>

Estableciendo el atributoreadonly los autores pueden mostrar texto no modificableen un elementoTEXTAREA. Esto no es lo mismo que usar código de texto estándar, ya queel valor delTEXTAREAse envía con el formulario.

Definiciones de atributos

prompt =texto[CS]

Desaprobado. Esteatributo especifica una cadena indicadora ("prompt") para el campo de entrada.

Atributos definidos en otros lugares

• id,class (identificadores a nivel de documento)
• lang (información sobre el idioma),dir (dirección del texto)
• title (título del elemento)
• style (informaciónde estilo en línea)

EJEMPLO DESAPROBADO:
La siguiente declaraciónISINDEX:

<ISINDEX prompt="Escriba la frase a buscar: ">

podría reescribirse conINPUT del siguiente modo:

<FORM action="..." method="post"><P>Entre la frase a buscar: <INPUT type="text"></P></FORM>

Semántica deISINDEX.Actualmente, la semántica deISINDEX sólo está bien definida cuando el URI basedel documento que lo contiene es un URI HTTP. En la práctica, la cadena introducidaestá restringida a Latin-1 ya que no hay ningún mecanismo con el que el URI puedaespecificar un juego de caracteres diferente.

<!ELEMENTLABEL - - (%inline;)* -(LABEL) -- texto del rótulo de un                                            campo de formulario --><!ATTLIST LABEL%attrs;                              --%coreattrs,%i18n,%events --forIDREF          #IMPLIED  -- concuerda con el valor ID del campo --accesskey%Character;    #IMPLIED  -- carácter de tecla de accesibilidad --onfocus%Script;       #IMPLIED  -- el foco se dirigió hacia el elemento --onblur%Script;       #IMPLIED  -- el elemento perdió el foco --  >

Definiciones de atributos

for =idref[CS]

Este atributo asocia explícitamente el rótulo definido con otro control.Cuando está presente, el valor de este atributo debe ser el mismo que el valordel atributoid de algún otro control del mismo documento.Cuando no está presente, el rótulo definido se asocia con los contenidosdel elemento.

Atributos definidos en otros lugares

• id,class (identificadores a nivel de documento)
• lang (información sobre el idioma),dir (dirección del texto)
• title (título del elemento)
• style (informaciónde estilo en línea)
• accesskey (teclasde acceso)
• onfocus,onblur,onclick,ondblclick,onmousedown,onmouseup,onmouseover,onmousemove,onmouseout,onkeypress,onkeydown,onkeyup (eventos intrínsecos)

Este ejemplo crea una tabla que se utiliza para alinear dos controles deentrada de texto y sus rótulos asociados. Cada rótuloestá explícitamente asociado a un control deentrada de texto:

<FORM action="..." method="post"><TABLE>  <TR>    <TD><LABEL for="nombre">Nombre</LABEL>    <TD><INPUT type="text" name="nombre">  <TR>    <TD><LABEL for="apellido">Apellido</LABEL>    <TD><INPUT type="text" name="apellido"></TABLE></FORM>

Este ejemplo extiende el formulario de un ejemplo previo haciendo que incluyaelementosLABEL.

 <FORM action="http://algunsitio.com/prog/usuarionuevo" method="post">    <P>    <LABEL for="nombre">Nombre: </LABEL>              <INPUT type="text"><BR>    <LABEL for="apellido">Last name: </LABEL>              <INPUT type="text"><BR>    <LABEL for="email">email: </LABEL>              <INPUT type="text"><BR>    <INPUT type="radio" name="sexo" value="Varón"> Varón<BR>    <INPUT type="radio" name="sexo" value="Mujer"> Mujer<BR>    <INPUT type="submit" value="Enviar"> <INPUT type="reset">    </P> </FORM>

En este ejemplo, asociamos implícitamente dos rótulos a dos controles deentrada de texto:

<FORM action="..." method="post"><P><LABEL>   Nombre   <INPUT type="text" name="nombre"></LABEL><LABEL>   <INPUT type="text" name="apellido">   Apellido</LABEL></P></FORM>

Obsérvese que esta técnica no puede utilizarse cuando se usa una tablapara fijar la disposición de los elementos, con el rótulo en una celda ysu control asociado en otra celda.

<!--  #PCDATA es para resolver el problema del contenido mixto,  de acuerdo con la especificación aquí sólo se permite espacio en blanco!--><!ELEMENTFIELDSET - - (#PCDATA,LEGEND,(%flow;)*) -- grupo de controles                                                     de formulario --><!ATTLIST FIELDSET%attrs;                              --%coreattrs,%i18n,%events --  ><!ELEMENTLEGEND - - (%inline;)*       -- leyenda del grupo de campos --><!ATTLIST LEGEND%attrs;                              --%coreattrs,%i18n,%events --accesskey%Character;    #IMPLIED  -- carácter de la tecla de accesibilidad --  >

Definiciones de atributos de LEGEND

align =top|bottom|left|right[CI]

Desaprobado. Esteatributo especifica la posición de la leyenda con respecto al grupo de campos (fieldset).Valores posibles:

• top: La leyenda está en la parte superior del grupo de campos. Este es elvalor por defecto.
• bottom: La leyenda está en la parte inferior del grupo de campos.
• left: La leyenda está a la izquierda del grupo de campos.
• right: La leyenda está a la derecha del grupo de campos.

Atributos definidos en otros lugares

• id,class (identificadores a nivel de documento)
• lang (información sobre el idioma),dir (dirección del texto)
• title (título del elemento)
• style (informaciónde estilo en línea)
• accesskey (teclas de acceso)
• onclick,ondblclick,onmousedown,onmouseup,onmouseover,onmousemove,onmouseout,onkeypress,onkeydown,onkeyup (eventos intrínsecos)

En este ejemplo, creamos un formulario que podría rellenarse en una consultamédica. Se divide en tres secciones: información personal, historial médico,y medicación actual. Cada sección contiene controles para introducir lainformación apropiada.

<FORM action="..." method="post"> <P> <FIELDSET>  <LEGEND>Información Personal</LEGEND>  Apellido: <INPUT name="personal_apellido" type="text" tabindex="1">  Nombre: <INPUT name="personal_nombre" type="text" tabindex="2">  Dirección: <INPUT name="personal_dirección" type="text" tabindex="3">...más información personal... </FIELDSET> <FIELDSET>  <LEGEND>Historial Médico</LEGEND>  <INPUT name="historial_enfermedades"          type="checkbox"          value="Viruela" tabindex="20"> Viruela  <INPUT name="historial_enfermedades"          type="checkbox"          value="Paperas" tabindex="21"> Paperas  <INPUT name="historial_enfermedades"          type="checkbox"          value="Mareos" tabindex="22"> Mareos  <INPUT name="historial_enfermedades"          type="checkbox"          value="Resfriado" tabindex="23"> Resfriado...más historial médico... </FIELDSET> <FIELDSET>  <LEGEND>Medicación Actual</LEGEND>  ¿Está tomando actualmente algún tipo de medicación?   <INPUT name="medicacion_ahora"          type="radio"          value="Sí" tabindex="35">Sí  <INPUT name="medicacion_ahora"          type="radio"          value="No" tabindex="35">No  Si está tomando actualmente algún tipo de medicación, indíquela  en el espacio proporcionado a continuación:  <TEXTAREA name="medicacion_actual"             rows="20" cols="50"            tabindex="40">  </TEXTAREA> </FIELDSET></FORM>

Obsérvese que en este ejemplo podríamos mejorar la presentación visual delformulario alineando los elementos dentro de cadaFIELDSET (con hojas de estilo), añadiendoinformación de fuentes y colores (con hojas de estilo), añadiendo scripts (por ejemplo,para abrir el área de texto de "medicación actual" sólo si el usuario indica que actualmenteestá tomando medicación), etc.

Definiciones de atributos

tabindex =número[CN]

Este atributo especifica la posición del elemento actual dentro delorden de tabulación del documento actual. Este valor debe ser un número entre 0y 32767. Los agentes de usuario no deberían tener en cuenta los ceros a la izquierda.

En este ejemplo, el orden de tabulación será elBUTTON,los elementosINPUT en orden (obsérvese que "campo1" y el botón comparten el mismotabindex, pero "campo1" aparece después en el flujo de caracteres), y por últimoel vínculo creado por el elementoA.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"   "http://www.w3.org/TR/html4/strict.dtd"><HTML><HEAD><TITLE>Un documento con FORM</TITLE></HEAD><BODY>...texto...<P>Ir al <A tabindex="10" href="http://www.w3.org/">sitio web del W3C.</A>...más texto...<BUTTON type="button" name="obtener-base-de-datos"           tabindex="1">Obtener la base de datos acutal.</BUTTON>...más texto...<FORM action="..." method="post"><P><INPUT tabindex="1" type="text" name="campo1"><INPUT tabindex="2" type="text" name="campo2"><INPUT tabindex="3" type="submit" name="enviar"></P></FORM></BODY></HTML>

Teclas de tabulación. La secuencia real de teclas que permitenla navegación con tabulador o la activación de los elementos depende de la configuracióndel agente de usuario (p.ej., la tecla "tab" se usa para la navegación y la tecla "intro"se usa para activar el elemento seleccionado).

Los agentes de usuario pueden también definir secuencias de teclas para navegaren orden inverso al de tabulación. Cuando se alcanza el final (o el principio) del ordende tabulación, los agentes de usuario puede volver al principio (o al final).

Definiciones de atributos

accesskey =carácter[CN]

Este atributo asigna una tecla de acceso a un elemento.Una teclade acceso es un carácter único del conjunto de caracteres del documento.Nota. Los autores deberían considerar la forma que tienen losusuarios potenciales de interaccionar a la hora de especificar la tecla de acceso.

Este ejemplo asigna la tecla de acceso "U" a un rótulo asociado con un controlINPUT. Al pulsar la tecla de acceso, el foco se dirige hacia el rótulo,el cual a su vez lo dirige al control asociado. El usuario puede entonces introducirtexto en el áreaINPUT.

<FORM action="..." method="post"><P><LABEL for="nombre-usuario" accesskey="U">User Name</LABEL><INPUT type="text" name="usuario"></P></FORM>

En este ejemplo, asignamos una tecla de acceso a un vínculo definido por el elementoA.Al pulsar esta tecla de acceso, el usuario es llevado a otro documento, en este casouna tabla de contenidos.

<P><A accesskey="C"       rel="contents"      href="http://algunsitio.com/especificacion/contenidos.html">    Tabla de Contenidos</A>

Definiciones de atributos

disabled[CI]

Cuando se establece para un control de formulario, este atributo booleanodeshabilita el control para la entrada de datos por parte del usuario.

En este ejemplo, el elementoINPUT está deshabilitado. Por tanto, no puede recibirdatos del usuario, y su valor no se enviará con el formulario.

<INPUT disabled name="pedro" value="piedra">

Nota. El único modo de modificar dinámicamente el valor delatributodisabled es por medio de unscript.

Definiciones de atributos

readonly[CI]

Cuando está establecido para un control de formulario, este atributo booleanoimpide que haya cambios en el control.

Nota. La única manera de modificar dinámicamente el valor delatributoreadonly es mediante unscript.

Nota. El método "get" restringe los valores delconjunto de datos del formulario a caracteres ASCII. Sólo el método"post" (conenctype="multipart/form-data") cubre el conjunto de caracteres[ISO10646] completo.

<FORM action="..." method="post"><P><INPUT type="password"            name="password-invisible"          value="mipassword"></FORM>

En este ejemplo, seguirá habiendo un valor emparejado con el nombre "password-invisible" queserá enviado con el formulario.

Nota. Consulte[RFC2388] para informaciónadicional sobre carga de ficheros, incluyendo cuestiones de compatibilidadcon versiones anteriores, la relación entre "multipart/form-data" y otros tiposde contenido, cuestiones de rendimiento, etc.

Consulte el apéndice para información sobrecuestiones de seguridad relacionadas con los formularios.

 <FORM action="http://servidor.com/cgi/procesar"       enctype="multipart/form-data"       method="post">   <P>   ¿Cómo se llama? <INPUT type="text" name="nombre-envio"><BR>   ¿Qué ficheros va a enviar? <INPUT type="file" name="ficheros"><BR>   <INPUT type="submit" value="Enviar"> <INPUT type="reset"> </FORM>