2011-04-14 3 views
19

몇 가지 옵션 (지불 방법 현금, 신용 카드 등)을 가져 와서 라디오 버튼에 바인딩하고 싶습니다. MVC 3에는 RadioButtonList가 없다고 생각합니다.Strongly Typed RadioButtonlist

또한 라디오가 바인딩되면 답변을 편집하는 동안 이전에 선택한 옵션을 사용자에게 표시하려고합니다.

public enum PaiementMethod 
{ 
    Cash, 
    CreditCard, 
} 

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

다음 컨트롤러 :

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

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

그리고 마지막으로보기 :

+0

HTTP ://jonlanceley.blogspot.com/2011/06/mvc3-radiobuttonlist-helper.html – Jon

답변

37

은 언제나 당신은 모델로 시작

@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" /> 
} 

그리고 당신은 좀 더 일반적인 솔루션을 원하는 경우 이것을 도우미로 요약하면 following answer이 도움이 될 수 있습니다.

+3

대단히 감사합니다 Darin.But 내 요구 사항은 데이터베이스 값에서 라디오 단추를 바인딩하고 텍스트/값 쌍을 라디오 단추에 지정하여 할당 할 수 있도록하는 것입니다. 모델의 속성에. – Vivek

+0

아주 좋은 작품! – Funky

+0

완벽! 잠시 동안 이걸 찾고 있었어 – bcahill

0

당신은 뷰 모델에 selectList의에 옵션을 결합해야하며, 내가 RadioButtonLists을 결합하고자하는 방법 이것은 이전에 선택한 옵션

4

true로 속성을 선택한 설정합니다. 뷰 모델에는 강력한 형식의 객체 컬렉션이 있습니다. 예를 들어, PaymentOptions가 코드 테이블 일 수 있습니다. 컬렉션과 함께 SelectedPaymentOptionKey (또는 기본 키 앞에 ID를 붙이면 Selected * Id)가 있습니다. 초기에이 키는 기본값 0 일 뿐이지 만 포스트 백에서는 선택한 항목의 값을 보유합니다. 그런 다음보기에서

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

는 :

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

m.SelectedPaymentOptionKey는 두 가지 목적을 제공합니다. 먼저, 라디오 버튼을 그룹화하여 선택 사항이 상호 배타적이되도록합니다. (필자는 FireBug와 같은 것을 사용하여 자신 만의 이해를 위해 생성 된 HTML을 검사 할 것을 권장합니다.) MVC에 대한 멋진 점은 상당히 기본적이고 표준적인 것입니다. 그래서 당신이 결국 당신의 견해의 행동을 예언 할 수있는 것은 어렵지 않아야합니다. 여기에는 거의 마술이 없습니다.). 둘째, 포스트 백에서 선택한 항목의 값을 보유합니다.

는 마지막으로 포스트 처리기에서 우리가 사용할 수있는 SelectedPaymentOptionKey 있습니다

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

SelectListItems을 사용하여 이상이의 장점은 당신이 그리드를 표시하는 경우 개체의 속성을 더에 액세스 할 수 있습니다/테이블 및 개체의 많은 값을 표시해야합니다. 나 또한 하드 코딩 된 문자열을 다른 접근 방식으로 HTML 도우미가 전달되는 것을 좋아한다.

단점은 모두 동일한 ID를 가진 라디오 버튼을 얻는 것입니다. 이는 실제로 좋은 습관이 아닙니다. 이것은 쉽게 변경하여 고정 :

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

는 마지막으로, 검증은 내가 본 라디오 버튼 기술의 대부분의 모두와 조금 황당하다. 정말 필요한 경우 라디오 버튼을 클릭 할 때마다 숨겨진 SelectedPaymentOptionsKey를 채우기 위해 일부 jquery를 연결하고 [Required] 또는 숨겨진 필드에 다른 유효성 검사를 배치합니다.

검증 문제에 대한 다른 해결 방법 ASP.NET MVC 3 unobtrusive validation and radio buttons

이 유망 보이지만 내가 그것을 테스트 할 수있는 기회가되지 않은 : 도움이 될 수 있습니다 내 블로그에 HTML 헬퍼가있다 http://memoriesdotnet.blogspot.com/2011/11/mvc-3-radiobuttonlist-including.html