asp.net mvc 3 - RadioButtonlist fuertemente tipado

asp.net-mvc-3 razor

Question

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

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

Answer 1

Así es como me gusta enlazar 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 se encuentra una Id. De pago seleccionada (o una Id. Seleccionada * si prefieres las claves primarias con la identificación). Inicialmente, esta clave solo tendrá un valor predeterminado de 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 
    });
} 

Luego 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)
}

La m.SelectedPaymentOptionKey cumple dos propósitos. Primero, agrupa los botones de Radio para que la selección sea mutuamente exclusiva (te animo a que uses algo como FireBug para inspeccionar el HTML generado solo para tu propia comprensión. 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 artículo seleccionado en la devolución de datos.

Y, finalmente, en el controlador de correos tenemos disponible SelectedPaymentOptionKey:

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

La ventaja de esto sobre el uso de SelectListItems es que tiene acceso a más propiedades del objeto en el caso de que esté mostrando una cuadrícula / tabla y necesite mostrar muchos valores del objeto. También me gusta que no se pasen cadenas codificadas en los ayudantes Html como lo hacen otros enfoques.

La desventaja es que tiene botones de radio que tienen la misma ID, lo que no es una buena práctica. Esto se arregla 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 las técnicas de botón de radio que he visto. Si realmente lo necesitara, conectaría algunos jQuery para rellenar una clave de selección de pago oculta cada vez que se haga clic en los botones de opción y coloque la [Required] u otra validación en el campo oculto.

Otra solución para el problema de validación ASP.NET MVC 3 validación discreta y botones de radio

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

Answer 2

Como siempre empiezas con un modelo:

public enum PaiementMethod
{
    Cash,
    CreditCard,
}

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

entonces 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 desea alguna solución más genérica que encapsule esto en un ayudante, puede encontrar útil la siguiente respuesta .

Answer 3

Debe enlazar sus opciones a SelectList en ViewModel y establecer el atributo Selected en verdadero para la opción previamente seleccionada