2012-05-18 13 views
11

Ho una vista MVCCome mappare le checkbox sui membri del modello MVC?

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

e ho un modulo con markup HTML per una serie di caselle:

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

e ho un paio di controller azione

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

e quell'azione è invocata quando il modulo viene inviato.

Come posso mappare le caselle su membri del ModelData (e ciò che i membri devo aggiungere a ModelData) in modo che, quando il modulo viene inviato data memorizza le informazioni sulle quali caselle di controllo vengono controllati?

risposta

9

OK, questo sarà per MVC3, ma, salvo le modifiche di sintassi, dovrebbe funzionare anche in MVC2. L'approccio è essenzialmente lo stesso.

Prima di tutto, si dovrebbe preparare una (vista) modello

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

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

appropriata Poi si passa questo modello per la vista si sta mostrando (controllore):

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

con la forma :

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

ora qui gli aiutanti HTML (tutte le CheckBoxFor, LabelFor, EditorFor ecc.) Consentono di associare i dati alle proprietà del modello.

Ora, un EditorFor quando la proprietà è di tipo bool ti darà la casella di controllo anche nella vista. :)

E poi, quando si invia al controller, si auto-legare i valori:

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

La menzione di EditorFor è un buon punto.EditorFor è utile quasi sempre. A seconda del tipo di dati, crea input di testo, textarea, checkbox e così via. – ozgur

3

In primo luogo si definisce SelectList per le opzioni. Questo sarà usato solo per rendere caselle

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

Than, si definisce il modello che conterrà il valore dell'opzione singolo scelto dopo post

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

Poi IList di queste opzioni in ModelData

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

E, infine, la vista

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

Dopo post, è solo ispezionare Options.Where(x => x.HasBeenChosen)

Questo è full-funzionali, e vi permetterà per visualizzare di nuovo vista quando si verificano errori di convalida, ecc Questo sembra un po 'complicato, ma non ho venire con qualsiasi migliore soluzione di questo

Problemi correlati