2011-04-14 10 views
19

Quiero obtener algunas opciones (por ejemplo, método de pago en efectivo, tarjeta de crédito, etc.) y vincularlas a los botones de opción. Creo que no hay RadioButtonList en MVC 3.Strongly Typed RadioButtonlist

Además, una vez que las radios están vinculadas, quiero mostrar la opción previamente seleccionada al usuario mientras edito la respuesta.

+0

Hay una ayuda HTML en mi blog que puede ayudar a http://jonlanceley.blogspot.com/2011/06/mvc3-radiobuttonlist-helper.html – Jon

Respuesta

37

Como siempre se empieza con un modelo:

public enum PaiementMethod 
{ 
    Cash, 
    CreditCard, 
} 

public class MyViewModel 
{ 
    public PaiementMethod PaiementMethod { get; set; } 
} 

luego de un controlador:

public class HomeController : Controller 
{ 
    public ActionResult Index() 
    { 
     var model = new MyViewModel(); 
     return View(model); 
    } 

    [HttpPost] 
    public ActionResult Index(MyViewModel model) 
    { 
     return View(model); 
    } 
} 

y, finalmente, una vista:

@model MyViewModel 
@using (Html.BeginForm()) 
{ 
    <label for="paiement_cash">Cash</label> 
    @Html.RadioButtonFor(x => x.PaiementMethod, "Cash", new { id = "paiement_cash" }) 

    <label for="paiement_cc">Credit card</label> 
    @Html.RadioButtonFor(x => x.PaiementMethod, "CreditCard", new { id = "paiement_cc" }) 

    <input type="submit" value="OK" /> 
} 

Y si quieres alguna solución más genérica que encapsula esto en un ayudante, puede resultarle útil following answer.

+3

Bien, gracias Darin. Pero mi requisito es vincular los botones de radio de los valores de la base de datos y asignar un par de texto/valor al botón de opción para que se pueda asignar. a la propiedad del Modelo. – Vivek

+0

Muy buen trabajo! – Funky

+0

¡perfecto! estado buscando esto por un tiempo ahora – bcahill

0

Usted debe unirse a sus opciones en SelectList modelo de vista y el conjunto seleccionado atributo en true para la opción seleccionada previamente

4

Esto es lo que me gusta de unirse RadioButtonLists. El modelo de vista tiene una colección de mis objetos fuertemente tipados. Por ejemplo, tal vez PaymentOptions es una tabla de códigos. Junto con la colección hay SelectedPaymentOptionKey (o Selected * Id si prefieres tus claves principales con Id). Inicialmente, esta clave será predeterminada 0, pero en la devolución de datos, mantendrá el valor del elemento seleccionado.

public class PaymentSelectionVM 
{ 
    public ICollection<PaymentOption> PaymentOptions { get; set; } 
    public int SelectedPaymentOptionKey { get; set; } 
} 

public ViewResult PaymentSelection() 
{ 
    var paymentOptions = db.PaymentOptions.ToList(); 
    return View(
    new PaymentSelectionVM { 
     PaymentOptions = paymentOptions, 

     //This is not required, but shows how to default the selected radiobutton 
     //Perhaps you have a relationship between a Customer and PaymentOption already, 
     //SelectedPaymentOptionKey = someCustomer.LastPaymentOptionUsed.PaymentOptionKey 
     // or maybe just grab the first one(note this would NullReferenceException on empty collection) 
     //SelectedPaymentOptionKey = paymentOptions.FirstOrDefault().PaymentOptionKey 
    }); 
} 

A continuación, en la vista:

@foreach (var opt in Model.PaymentOptions) 
{   
    @*Any other HTML here that you want for displaying labels or styling*@ 
    @Html.RadioButtonFor(m => m.SelectedPaymentOptionKey, opt.PaymentOptionKey) 
} 

El m.SelectedPaymentOptionKey tiene dos propósitos. Primero, agrupa los botones de Radio juntos para que la selección sea mutuamente exclusiva (lo animo a usar algo como FireBug para inspeccionar el html generado solo para su propio entendimiento. Lo maravilloso de MVC es que el HTML generado es bastante básico y estándar por lo que no debería ser difícil para usted poder predecir el comportamiento de sus puntos de vista. Aquí hay muy poca magia). En segundo lugar, mantendrá el valor del elemento seleccionado en la devolución de datos.

Y finalmente en el controlador puesto que tienen la SelectedPaymentOptionKey disponibles:

[HttpPost] 
public ActionResult PaymentSelection(PaymentSelectionVM vm) 
{ 
    currentOrder.PaymentOption = db.PaymentOptions.Find(vm.SelectedPaymentOptionKey); 
    .... 
} 

La ventaja de este sobre el uso de SelectListItems es que tienes acceso a más de las propiedades del objeto en el caso de que se está mostrando una cuadrícula/tabla y necesita mostrar muchos valores del objeto. También me gusta que no se hayan pasado cadenas codificadas en los helpers Html como lo han hecho otros enfoques.

La desventaja es que obtienes botones de opción que tienen la misma identificación, lo cual no es una buena práctica. Esto se puede arreglar fácilmente cambiando a esto:

@Html.RadioButtonFor(m => m.SelectedPaymentOptionKey, opt.PaymentOptionKey, new { id = "PaymentOptions_" + opt.PaymentOptionKey}) 

Por último, la validación es un poco peculiar con la mayoría de todas las técnicas de botón de radio que he visto. Si realmente lo necesitara, conectaría algunos jquery para rellenar una SelectedPaymentOptionsKey oculta cada vez que se haga clic en los botones de opción, y colocaré el [Required] u otra validación en el campo oculto.

Otra solución para el problema de validación ASP.NET MVC 3 unobtrusive validation and radio buttons

Esto parece prometedor, pero no he tenido la oportunidad de probarlo: http://memoriesdotnet.blogspot.com/2011/11/mvc-3-radiobuttonlist-including.html

Cuestiones relacionadas