2012-05-18 23 views
11

MVC görünümüOnay kutularını MVC model üyelerine nasıl eşlerim?

<%@ Page Language="C#" MasterPageFile="PathToMaster" Inherits="System.Web.Mvc.ViewPage<ModelData>" %> 

sahip ve onay kutuları kümesi için HTML işaretlemesi ile bir form:

<label for="MyCheckbox">Your choice</label> 
<input type="checkbox" id="Option1" class="checkbox" name="MyCheckbox" value="Option one" /> 
<label for="Option1">Option one</label><br /> 
<input type="checkbox" id="Option2" class="checkbox" name="MyCheckbox" value="Option two" /> 
<label for="Option2">Option two</label><br /> 

ve bir kontrol-aksiyon çifti

class MyController : Controller { 
    [AcceptVerbs(HttpVerbs.Post)] 
    public ActionResult RequestStuff(ModelData data) 
    { 
    } 
} 

sahip ve form gönderildiğinde bu eylem başlatılır.

nasıl üyeleri üzerine onay kutularını map yok ModelData (ve ModelData eklemek gerekenleri üyeleri) hangi onay kutularını kontrol edilir formu data bilgiler depolar gönderildiğinde böylece?

cevap

9

Tamam, bu bir MVC3 için olacak, ancak - sözdizimi değişiklikleri için kaydet - MVC2 de çalışmalıdır. Yaklaşım aslında aynıdır. formu ile

public ActionResult EditMyForm() 
{ 
    var viewModel = new MyViewModel() 
    return View(viewModel); 
} 

: Herşeyden

Öncelikle, gösterdiğiniz görünümüne Bu modeli (kontrolör) geçmesi Sonra uygun bir (görünüm) modeli

public class MyViewModel 
{ 
    [DisplayName("Option 1")] 
    public bool Option1 { get; set; } 

    [DisplayName("Option 2")] 
    public bool Option2 { get; set; } 
} 

hazırlamalısınız :

@model MyViewModel 
@using(Html.BeginForm()) 
{ 
    @Html.Label("Your choice") 

    @Html.LabelFor(model => model.Option1) // here the 'LabelFor' will show you the name you set with DisplayName attribute 
    @Html.CheckBoxFor(model => model.Option1) 

    @Html.LabelFor(model => model.Option2) 
    @Html.CheckBoxFor(model => model.Option2) 
    <p> 
     <input type="submit" value="Submit"/> 
    </p> 
} 

Şimdi burada HTML yardımcıları (bütün CheckBoxFor, LabelFor, EditorFor vb.) Verilerin model özelliklerine bağlanmasına izin verilir.

Özelliktüründe EditorFor olduğunu düşünürseniz, bu durumda da size onay kutusunu gösterecektir. Eğer kontrolöre gönderdiğinizde :)

Ve sonra, bu değerler otomatik bağlayacaktır:

[HttpPost] 
public ActionResult EditMyForm(MyViewModel viewModel) 
{ 
    //And here the view model's items will be set to true/false, depending what you checked. 
} 
+0

Düzenleme Düzenleyicisi iyi bir nokta.EditorFor neredeyse her zaman yararlıdır. Veri tipine bağlı olarak, metin girişi, textarea, onay kutusu vb. – ozgur

3

Önce Seçenekler için SelectList tanımlar. Bu onay kutularını

public IList<SelectListItem> OptionsSelectList { get; set; } 

Daha, sen ModelData

public IList<ChooseOptionViewModel> Options { get; set; } 
bu seçeneklerin yazısı sonra

public class ChooseOptionViewModel 
{ 
    public int OptionIdentifier { get; set; } //name or id 
    public bool HasBeenChosen { get; set; } //this is mapped to checkbox 
} 

Sonra IList tek seçilen seçeneğin değerini tutacak modeli tanımlamak

işlemek için sadece kullanılacaktır

Ve son olarak, görünüm

@for (int i = 0; i < Model.OptionsSelectList.Count(); i++) 
    { 
     <tr> 
      <td class="hidden"> 
       @Html.Hidden("Options[" + i + "].OptionIdentifier", Model.OptionsSelectList[i].Value) 
      </td> 
      <td> 
       @Model.OptionsSelectList[i].Text 
      </td> 
      <td> 
       @Html.CheckBox("Options[" + i + "].HasBeenChosen", Model.Options != null && Model.Options.Any(x => x.OptionIdentifier.ToString().Equals(Model.OptionsSelectList[i].Value) && x.HasBeenChosen)) 
      </td> 
     </tr> 
    } 

yazı sonra, sadece bu dolu işlevseldir Options.Where(x => x.HasBeenChosen)

incelemek ve doğrulama hataları ortaya çıktığında o manzaranın yeniden görüntülemek sağlayacak vs. Bu biraz karmaşık görünüyor, ama herhangi bir ile gelip değil bundan daha iyi bir çözüm.

İlgili konular