2009-10-24 11 views
12

Tengo un formulario con muchos grupos de radios. Cada radio tiene una identificación única y tiene el mismo nombre que los demás en su grupo. La página se valida como XHTML transicional.Botón de radio de Firefox Weirdness

Probado en IE6 & 7, Opera, Safari y Chrome funciona exactamente como lo pensaría desde la entrada del mouse o del teclado.

En FireFox se vuelve una locura. Un solo clic en cualquier radio en un grupo establece la primera radio en el grupo marcado. Un doble clic en una radio generalmente lo selecciona. ¿Alguien ha visto esto antes?

grupo de muestra se ve así:

<input type="radio" name="upAndDown_1" id="upAndDown_11" value="Y" /> Y <br /> 
<input type="radio" name="upAndDown_1" id="upAndDown_12" value="N" checked="checked" /> N<br /> 
<input type="radio" name="upAndDown_1" id="upAndDown_13" value="NA" /> NA 

El phonmomenon puede ser probada aquí: http://www.nolaflash.com/stackoverflow/firefox_and_radios.html

Cualquier consejo apreciado.

Respuesta

14

Doh! Mi diseñador tenía una sola etiqueta que envolvía cada grupo de radios. Al eliminar la etiqueta de etiqueta se corrige la rareza de FireFox.

+1

Sí, una entrada dentro de una etiqueta es considerado como asociar la etiqueta con la entrada, como si una 'for = "..."' se había utilizado para asociarlos. Esto es parte del estándar HTML, aunque no es compatible con IE. – bobince

+1

El comportamiento ocurre cuando tienes la misma identificación para las radios si asignas el mismo nombre y diferentes ID no tendrás este efecto. –

5

De hecho es la etiqueta circundante <label> que causa el problema de Firefox (aunque es html válido). Esto debería hacer el truco:

<input type="radio" name="upAndDown_2" id="upAndDown_21" value="Y"/><label for="upAndDown_21">Y</label><br/> 
<input type="radio" name="upAndDown_2" id="upAndDown_22" value="N"/><label for="upAndDown_22">N</label><br/> 
<input type="radio" name="upAndDown_2" id="upAndDown_23" value="NA" checked="checked"/><label for="upAndDown_22">NA</label>