2012-05-18 5 views
11

Ich habe eine Ansicht MVCWie mappe ich Kontrollkästchen auf MVC-Modellmitglieder?

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

und ich habe ein Formular mit HTML-Markup für eine Reihe von Kontrollkästchen:

<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 /> 

und ich habe ein Controller-Aktions-Paar

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

und diese Aktion wird aufgerufen, wenn das Formular gesendet wird.

Wie ordne ich die Kontrollkästchen auf Mitglieder von ModelData (und welche Mitglieder ich zu ModelData hinzufügen müssen), so dass, wenn das Formular abgeschickt wird data speichert Informationen, auf die Kontrollkästchen aktiviert werden?

Antwort

9

OK, dieser wird für MVC3 sein, aber - abgesehen von Syntaxänderungen - sollte auch in MVC2 funktionieren. Der Ansatz ist im Wesentlichen der gleiche.

Zunächst einmal sollten Sie ein entsprechendes (Ansicht) Modell

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

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

Dann passieren Sie dieses Modell zur Ansicht Sie zeigt (Controller) vorbereiten:

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

mit der Form :

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

hier die HTML-Helfer (alle CheckBoxFor, LabelFor, EditorFor usw.) ermöglichen, die Daten an die Modelleigenschaften zu binden.

Nun denken Sie daran, ein EditorFor, wenn die Eigenschaft vom Typ bool wird Ihnen die Check-Box in der Ansicht, auch. :)

Und dann, wenn Sie an die Steuerung übermitteln, es werden die Werte automatisch binden:

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

Erwähnen EditorFor ist ein guter Punkt.EditorFor ist fast immer nützlich. Abhängig vom Datentyp erstellt er Texteingabe, Textbereich, Checkbox und so weiter. – ozgur

3

Zuerst SelectList für Optionen definieren. Dies wird nur verwendet werden, Kontrollkästchen machen

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

als Sie Modell definieren, den Wert einzelner gewählte Option nach Post hält

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

Dann IList diesen Optionen in ModelData

public IList<ChooseOptionViewModel> Options { get; set; } 

Und schließlich, die Ansicht

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

Nach Post, Sie prüfen nur Options.Where(x => x.HasBeenChosen)

Das ist voll funktionsfähig, und es erlauben Sie Ansicht erneut anzuzeigen, wenn die Überprüfung Fehler auftreten, usw. Dies scheint ein wenig kompliziert, aber ich habe nicht kommen mit jedem bessere Lösung als das.

Verwandte Themen