Cómo asociar elementos de etiquetas con botones de opción

Question

Tengo algunos botones de opción en mi formulario y siempre tengo que hacer clic exactamente en el botón de opción redondo para seleccionarlo. ¿Hay alguna manera de permitir que el usuario haga clic en la etiqueta asociada para seleccionar el botón de opción?

<p> 
    <span class="editor-label"> 
     @Html.LabelFor(m => m.ADR) 
    </span> 
    <span class="editor-field"> 
     @Html.RadioButtonFor(model => model.ADR, "Yes", AdrYesOptions) 
     @UserResource.YesValue 
     @Html.RadioButtonFor(model => model.ADR, "No", AdrNoOptions) 
     @UserResource.NoValue 

    </span> 
</p> 

he encontrado algunas soluciones aquí: How to associate labels with radio buttons pero estos no me convienen porque prefiero una solución específica para MVC.

Answer 1

envolver cada botón de opción y texto de la etiqueta asociada dentro de un elemento <label>:

<p> 
    <span class="editor-label"> @Html.LabelFor(m => m.ADR) </span> 
    <span class="editor-field"> 
     <label> @Html.RadioButtonFor(model => model.ADR, "Yes", AdrYesOptions) @UserResource.YesValue </label> 
     <label> @Html.RadioButtonFor(model => model.ADR, "No", AdrNoOptions) @UserResource.NoValue </label> 
    </span> 
</p>