Cómo asociar etiquetas con los botones de radio

Question

estoy usando MVC, y tengo una configuración simple botón de radio:

<%=Html.RadioButton("my_flag", True)%><label>Yes</label> 
<%=Html.RadioButton("my_flag", False)%><label>No</label> 

Lo único que me falta es que no se puede hacer clic en la etiqueta para seleccionar el botón de radio Normalmente tendrá que utilizar:

<label for="my_flag"> 

pero que asocia las dos etiquetas con el último botón de radio. ¿Hay alguna forma de asociar las etiquetas con el botón de opción correcto?

Nota: Esto es imitar un formulario en papel, por lo que cambiar a una casilla de verificación no es una opción.

Answer 1

necesario para la administración de los dos botones de radio del mismo nombre (para que estén en el mismo grupo), pero diferentes identificadores de (de modo que se puede asociar con la etiqueta de cada uno de ellos individualmente). No estoy familiarizado con ASP.NET MVC, así que no sé cómo lograrlo, pero esa es la solución.

Editar: una segunda posibilidad consiste en envolver los botones de opción dentro de la etiqueta etiqueta, así:

<label><%=Html.RadioButton("my_flag", True)%>Yes</label> 
<label><%=Html.RadioButton("my_flag", False)%>No</label> 

* Tenga en cuenta que de esta manera puede realmente tener una mejor compatibilidad con los navegadores, sé que algunos navegadores siguen siendo dudoso acerca de la distinción nombre/Identificación del

Answer 2

no soy un programador asp, así que lo siento si me voy a decir algo fuera: P atributo

de Etiqueta para se hace referencia al ID de entrada. Por lo tanto, tendrá que hacer algo como

<input type="radio" name="rad1" id="rad1_1"><label for="rad1_1">Rad1</label> 
<input type="radio" name="rad1" id="rad1_2"><label for="rad1_2">Rad2</label> 

Answer 3

Tiene dos formas diferentes de implementar esto.

La primera es la solución simple es incrustar el botón de radio dentro de una etiqueta <label/>.

<p> 
    <label><%=Html.RadioButton("option", "yes") %> Yes</label> 
</p> 

<p> 
    <label><%=Html.RadioButton("option", "no") %> No</label> 
</p> 

La segunda ruta es asociar cada botón de radio con una ID. Esto también es bastante sencillo con el argumento htmlAttributes y permite una mayor flexibilidad en lo que respecta a la disposición formulario:

<p> 
    <label for="option_yes">Yes:</label> 
    <%=Html.RadioButton("option", "yes", new { id = "option_yes" }) %> 
</p> 

<p> 
    <label for="option_no">Np:</label> 
    <%=Html.RadioButton("option", "no", new { id = "option_no" }) %> 
</p> 

Recomendaría este último, y parece ser el que usted está pidiendo demasiado.

EDITAR

De hecho, usted debe dar el argumento con el atributo id no importa qué. Si no lo hace, su sitio tendrá múltiples elementos con la misma ID, y esto no validará HTML.

Answer 4

Usted puede hacerlo de esta manera: (Se trata de utilizar la maquinilla de afeitar, pero es fácil de traducir.)

@Html.RadioButtonFor(model => model.MyValue, true, new { id = "MyValue_True" }) 
<label for="MyValue_True">Yes, this is true</label> 

@Html.RadioButtonFor(model => model.MyValue, false, new { id = "MyValue_False" }) 
<label for="MyValue_False">No, this is false</label> 

Básicamente se especifica manualmente el atributo id para los botones de radio.