3
respuestas

[Duda] 03. Tipos de Campos diferentes (Input-radio dentro del label)

Referente al curso HTML5 y CSS3 parte 3: Trabajando con formularios y tablas

por Eduardo Argana Rodriguez
| 32.3k xp | 24 posts

Si el input-radio ya queda relacionado dentro del label, ¿porque se mantuvo el 'for' del label y el 'id' del input-radio? 

<p>Como le guataria que lo contactemos?</p>

<label for="radio-email"><input type="radio" name="cantacto" value="email" id="radio-email">Email</label>

<label for="radio-telefono"><input type="radio" name="cantacto" value="telefono" id="radio-telefono">Telefono</label>

<label for="radio-whatsapp"><input type="radio" name="cantacto" value="whatsapp" id="radio-whatsapp">Whatsapp</label>
3 respuestas
por Bruno Botelho de Souza
| 3905.5k xp | 14841 posts
Alura Scuba Team Scuba Team | Front-end

¡Hola Eduardo!

La razón por la que se mantiene el atributo "for" en la etiqueta "label" y el atributo "id" en el elemento "input" es para establecer una relación entre ellos. Esto permite que, al hacer clic en el texto del "label", se seleccione automáticamente el campo de entrada correspondiente.

En el código que compartiste, el atributo "for" en cada etiqueta "label" se utiliza para especificar qué campo de entrada está asociado a esa etiqueta. Por ejemplo, el atributo "for" en el primer "label" está establecido como "radio-email", mientras que el atributo "id" en el primer "input" está establecido como "radio-email". Esto significa que al hacer clic en el texto del "label", se seleccionará automáticamente el campo de entrada correspondiente.

Si el atributo "for" no se especifica en el "label" o no coincide con el atributo "id" del "input", la funcionalidad de selección automática no se aplicará.

¡Saludos!

Si este post te ayudó, por favor marca como solucionado ✓. ¡Continúa con tus estudios!
por Eduardo Argana Rodriguez
| 32.3k xp | 24 posts

Entiendo la relación del ‘for’ y el ‘id’, pero en el curso se menciono que poner el 'input' dentro del 'label' era otra forma de hacer la relación sin necesidad de usar el ‘for’ y el ‘id’; y esa era mi duda; ¿por que se mantuvo las 2 formas de relación si ambas cumplen con el mismo propósito? A saber de que el texto del "label" se seleccione automáticamente el campo de entrada correspondiente de su input; creo que hubo una redundancia innecesaria en ese aspecto.

por Mauricio López Ortega
| 34.2k xp | 5 posts

Hola, también tenia la misma duda pero me quedo con que "el atributo for en la etiqueta label y el atributo id en la etiqueta input se usan para establecer una relación entre ambos".

Gracias Bruno.