input dentro de label?

[elfopower]

Buen dia a todos!

Estoy evaluando mi sitio en eXaminator y me muestra una advertencia respecto a la ubicacion del label en un form.

Estuve documentandome y en todos los sitios que visité estaba de la forma siguiente: (es la que eXaminator me muestra como advertencia)

<label for="nombre">Nombres </label>
<input id="nombre" value="Nombres" name="nombre" type="text" />

Para que eXaminator me dejara de mostrar dicha advertencia hice lo siguiente:

<label for="nombre">Nombres
<input id="nombre" value="Nombres" name="nombre" type="text" />
</label>

Ahora que estoy analizando misitio en webagogo me muestra un error por estar el input dentro del label.

Cual de las dos uso?

Saludos

[Mikmoro]

El correcto es el primero. No te fies de Examinator y valida tu web en la w3c.

[elfopower]

Te lo agradezco de nuevo.

Saludos y hasta pronto.

[c0lo]

¿A caso el segundo ejemplo está mal?
Yo lo empezé a usar así hace un tiempo, y las webs me validan igual...

Saludos!

[Mikmoro]

Yo no digo que esté mal, pero un label es un label, y tiene una función concreta. No me parece lógico meter un campo dentro de la propia etiqueta que está pensada para darle nombre.
Es mi opinión.

[webosiris]

Iniciado por Mikmoro

Yo no digo que esté mal, pero un label es un label, y tiene una función concreta. No me parece lógico meter un campo dentro de la propia etiqueta que está pensada para darle nombre.
Es mi opinión.

ambas formas son correctas. la primera es una asociación explicita y la segunda una implicita (y por lo tanto no es necesario el for). Copio lo que dice la w3c:

El elemento LABEL puede utilizarse para adjuntar información a los controles. Cada elemento LABEL se asocia exactamente con un control de formulario. El atributo for asocia explícitamente un rótulo con otro control: el valor del atributo for debe ser el mismo que el valor del atributo id del elemento de control asociado. Se puede asociar más de un LABEL con el mismo control creando múltiples referencias a través del atributo for.

Para asociar implícitamente un rótulo con otro control, el elemento de control debe estar dentro de los contenidos del elemento LABEL. En este caso, el LABEL sólo puede contener un elemento de control. El rótulo en sí puede colocarse antes o después del control asociado.

personalmente por un tema de facilidad para maquetar, asocio explicitamente los input text e implicitamente los checkbox y radio

[Mikmoro]

Correcto. Pero... ¿qué significa exactamente esta frase?:

Para asociar implícitamente un rótulo con otro control

[webosiris]

el rotulo vendria a ser el texto en si mismo... en este ejemplo:

Código HTML:

<labe>Nombres 
<input id="nombre" value="Nombres" name="nombre" type="text" />
</label> 

Nombres -> rótulo
input -> control

Iniciado por W3C

El rótulo en sí puede colocarse antes o después del control asociado.

osea, que da lo mismo <label>rótulo input </label> que <label>input rótulo</label>

PD: lo de "otro control" se debe a que el primer control es el boton de envio... la mención a eso esta un poco + arriba del texto que cité.

A algunos controles de formulario se les asocian rótulos automáticamente (botones pulsadores) aunque a la mayoría no (campos de texto, casillas de verificación y radiobotones, y menúes). Para aquellos controles que tengan rótulos implícitos, los agentes de usuario deberían utilizar el valor del atributo value como texto del rótulo.
El elemento LABEL se utiliza para especificar rótulos de controles que no tienen rótulos implícitos

[Mikmoro]

Siento no estar de acuerdo.

El atributo for asocia explícitamente un rótulo con otro control: el valor del atributo for debe ser el mismo que el valor del atributo id del elemento de control asociado. Se puede asociar más de un LABEL con el mismo control creando múltiples referencias a través del atributo for.

Para asociar implícitamente un rótulo con otro control, el elemento de control debe estar dentro de los contenidos del elemento LABEL. En este caso, el LABEL sólo puede contener un elemento de control. El rótulo en sí puede colocarse antes o después del control asociado.

Yo interpreto:

El atributo for asocia explícitamente un rótulo con otro control: el valor del atributo for debe ser el mismo que el valor del atributo id del elemento de control asociado.

Está claro: se asocia explícitamente con el for y el ID.

Se puede asociar más de un LABEL con el mismo control creando múltiples referencias a través del atributo for

Muy bien, usando el mismo for podemos asociar varios label con el mismo control.

Para asociar implícitamente un rótulo con otro control, el elemento de control debe estar dentro de los contenidos del elemento LABEL. En este caso, el LABEL sólo puede contener un elemento de control.

Por el contrario, si lo que queremos es asociar dos controles a un mismo label (y no al revés), lo hacemos referenciando uno de ellos con el for y el segundo introduciéndolo dentro del label (sólo uno).

"Para asociar implícitamente un rótulo con otro control (además del que ya está asociado explícitamente, interpreto)"

Así es como yo lo interpreto.
Uno a uno: for a ID
Dos label a un control: mismo for al mismo ID
Dos controles al mismo label: uno for e ID y el otro dentro, ya que no podríamos usar dos veces el mismo ID.

Yo creo que es asi, y este no era el caso, ya que se trataba de un label y un control

[webosiris]

me encanta cuando se producen estas discusiones, porque terminamos aprendiendo más todos

dicho esto, no estoy de acuerdo con tu interpretación... es que es una interpretación que hasta no cuadra con el ejemplo dado por la misma w3c. si ves cuando explica la asociación implicita, dice esto:

En este ejemplo, asociamos implícitamente dos rótulos a dos controles de entrada 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>

asi que como ves, la w3c lo interpreta como dije en mi mensaje anterior

BTW, se usa "otro" las 2 veces..

El atributo for asocia explícitamente un rótulo con otro control [... ] Para asociar implícitamente un rótulo con otro control

[Mikmoro]

Para mi que eso no contradice mi interpretación, quiero decir: muestra un ejemplo de la asociación implícita, en ausencia de un identificador para el control, pero eso no implica que la asociación implícita no se use además de para esa ausencia, para una aociación de un label para dos controles.

De hecho, es un ejemplo de asociación implícita, algo que es posible en ausencia de un identificador en el control, pero así mismo algo completamente innecesario si cuenta con éste y la asociación es explícita, por lo que el ejemplo inicial:

<label for="nombre">Nombres
<input id="nombre" value="Nombres" name="nombre" type="text" />
</label>

tampoco es del todo correcto, porque está haciendo la asociación implícita y explícita al mismo tiempo, algo carente de sentido. Por eso dije "la forma correcta es la primera". Quizá ambas sean realmente correctas, pero una tiene sentido y la otra es una redundancia innecesaria.

[webosiris]

en todo lo que dices en tu ultimo mensaje estoy de acuerdo, entonces soy yo el que no entiende que es lo que te hace "no estar de acuerdo." con mi mensaje anterior (#8)

resumiendo:
1 rótulo 1 control -> 1 label con FOR o implicito
2 rótulos 1 control -> 2 label con FOR o 1 label con FOR y otra implicita
1 rótulo 2 controles -> 1 label con FOR al 1° control e implicito al 2° control

está haciendo la asociación implícita y explícita al mismo tiempo, algo carente de sentido.

en eso también estoy de acuerdo, y si ves mi primer mensaje, dije " y la segunda una implicita (y por lo tanto no es necesario el for)"

creo que es claro que cuando se una la asociación implicita, no es necesario el for ya que queda redundante.

[Mikmoro]

Bueno, no estaba de acuerdo con el sentido que dabas a "otro control", porque como ves yo lo interpretaba de otra forma.

Y por otro lado, como dices en tu primer mensaje decías:

ambas formas son correctas. la primera es una asociación explicita y la segunda una implicita (y por lo tanto no es necesario el for)

usándolo como réplica a mi afirmación de que la primera forma era la correcta, sin embargo con el anterior mensaje me reafirmo en que es así, porque la segunda es redundante, y por tanto "menos correcta".

Creo que el asunto de la consulta ha quedado someramente definido con el debate adjunto

[derkenuke]

Mira, qué debate tan interesante encuentra uno por aquí.

Yo siempre lo he interpretado como webosiris, siendo

Iniciado por webosiris

1 rótulo 1 control -> 1 label con FOR o implicito
2 rótulos 1 control -> 2 label con FOR o 1 label con FOR y otra implicita
1 rótulo 2 controles -> 1 label con FOR al 1° control e implicito al 2° control

Y que la segunda forma de #1 es redundante (pero supongo que no incorrecta).


Pero también creo que la especificación induce a errores o malinterpretaciones.
Hemos quedado con 1 rótulo y 2 controles es posible. El elemento label habla:

Cada elemento LABEL se asocia exactamente con un control de formulario.

Y no veo ningún ejemplo (y nunca he visto) de un label asociado a dos controles. Personalmente ni siquiera le veo sentido.

Otra duda es que comenta:

Se puede asociar más de un LABEL con el mismo control creando múltiples referencias a través del atributo for.

Con el consentimiento de elfopower, que es el que ha empezado el hilo y creo que su duda está resulta: ¿Qué interpretáis con eso de creando múltiples referencias a través del atributo for? No sé qué son multiples referencias, pero deja claro que en el valor del for va un IDREF, no un IDREFS...

También veo que según los hijos que puede tener ((%inline;)* -(LABEL)) podría meter varios input dentro del label. Excepto en el caso de asociación implícita (dice que en implícito sólo puede contener un control - Para asociar implícitamente un rótulo con otro control, el elemento de control debe estar dentro de los contenidos del elemento LABEL. En este caso, el LABEL sólo puede contener un elemento de control. El rótulo en sí puede colocarse antes o después del control asociado.) ¿Tengo que entender que esto es correcto?:

Código HTML:

<label id="apellido"> Identificación
	<input type="text" name="nombre" />
	<input type="text" name="apellido1" id="apellido" />
	<input type="text" name="apellido2" />
</label> 

Asociación explícita a apellido (que firefox al pulsar en el label no me lleva a ese campo) y asociación implícita a los demás campos... . ¿Os parece legal? A mi en un principio no me lo parecería, pero... si sólo permitiera como hijo un control de formulario podría definirse así: ( (%fontstyle; | %phrase; | %special;)*, %formctrl;) -(LABEL) (espero no equivocarme).


Si te pones quisquilloso, la especificación puede ser un infierno; pero si no, es un cachondeo

[webosiris]

Iniciado por derkenuke

Hemos quedado con 1 rótulo y 2 controles es posible. El elemento label habla:

Y no veo ningún ejemplo (y nunca he visto) de un label asociado a dos controles. Personalmente ni siquiera le veo sentido.

formidable tu observación... habria que hacer algunas pruebas, pero creo que Mike y yo nos hemos dejado llevar por la corriente. Ahora que dices, tampoco le veo sentido salvo que el punto de ingreso de datos se divida en 2
Así que recapacitando mis mensajes anteriores con esta nueva observación (gracias!) {1 rótulo, 2 controles} no lo veo posible.

¿Qué interpretáis con eso de creando múltiples referencias a través del atributo for? No sé qué son multiples referencias

multiples referencias = muchos for con el mismo valor. Osea, asociar más de una label explicita al mismo control

¿Tengo que entender que esto es correcto?

no, no es correcto porque siempre que pongas un control dentro de un label, estan asociados de forma implicita, es algo automático. asi que en tu ejemplo habria 3 implicitas + 1 explicita con el mismo label, cuando esta claro que solo puede haber 1 implicita por label.

[derkenuke]

Iniciado por webosiris

no, no es correcto porque siempre que pongas un control dentro de un label, estan asociados de forma implicita, es algo automático. asi que en tu ejemplo habria 3 implicitas + 1 explicita con el mismo label, cuando esta claro que solo puede haber 1 implicita por label.

Me equivoqué de código, tanto for y tanto id. Lo que quise escribir es:

Código:

<label for="apellido"> Identificación
	<input type="text" name="nombre" />
	<input type="text" name="apellido1" id="apellido" />
	<input type="text" name="apellido2" />
</label>

Pero bueno. ¿Entonces crees que no puede haber más de un control asociado a un mismo label? ¿Es porque pone esto en la especificación?

Para asociar implícitamente un rótulo con otro control, el elemento de control debe estar dentro de los contenidos del elemento LABEL. En este caso, el LABEL sólo puede contener un elemento de control. El rótulo en sí puede colocarse antes o después del control asociado.

Entre eso, y el uso de "otro control", la especificación es un lío
No me parece que esté escrita de una forma clara y sin que de pie a ambiguedades. ¿Deducimos que no se puede asociar un LABEL a más de un control?


¿Qué me decís de incluir muchos controles según los hijos que deja tener?

Iniciado por derkenuke

También veo que según los hijos que puede tener ((%inline;)* -(LABEL)) podría meter varios input dentro del label. Excepto en el caso de asociación implícita
(...)
si sólo permitiera como hijo un control de formulario podría definirse así: ( (%fontstyle; | %phrase; | %special;)*, %formctrl;) -(LABEL) (espero no equivocarme).

¿Encontráis otros elementos HTML que sólo puedan contener solamente un hijo? Asi de pronto no me viene ninguno a la cabeza... Excepto los elementos especiales HTML y HEAD, que son un caso raro. Por ejemplo HEAD ((%head.content;) +(%head.misc;) siendo %head.content; = "TITLE & BASE?") se ve que (según esta sintaxis): Debe contener un TITLE, y puede contener o no un BASE, en cualquier orden. Además pueden aparecer o no elementos %head.misc; (que no pone que pueden ser varios con *, pero se ve en el enlace elementos de cabecera repetibles )

Se me está haciendo un lío la cabeza con estas cosas.