CheckboxList in MVC3 Visualizza e ottiene gli elementi controllati passati al controller

Ho una lezione per MoreInfo:

public class MoreInfo { public string Name { get; set; } public string selectedCheckboxItems {get; set;} } 

Voglio sapere come creare un elenco di caselle di controllo sulla vista e passare gli elementi spuntati al mio controller su submit.

Come dovrei fare per creare l’elenco delle caselle di controllo e come passare tutti gli elementi selezionati e elaborarli?

Modifichiamo un po ‘il tuo modello:

 public class ItemViewModel { public string Id { get; set; } public string Name { get; set; } public bool Checked { get; set; } } 

allora potresti avere un controller:

 public class HomeController: Controller { public ActionResult Index() { // This action is used to render the form => // we should populate our model with some values // which could obviously come from some data source var model = new[] { new ItemViewModel { Id = "1", Checked = true, Name = "item 1" }, new ItemViewModel { Id = "2", Checked = false, Name = "item 2" }, new ItemViewModel { Id = "3", Checked = true, Name = "item 3" }, }; return View(model); } [HttpPost] public ActionResult Index(IEnumerable items) { // This action will be invoked when the form is submitted // and here the view model will be properly bound and // you will get a collection of all items with their // corresponding id, name and whether they were checked or not ... } } 

allora avresti una vista corrispondente ( ~/Views/Home/Index.cshtml ) che conterrebbe il modulo che consente all’utente di selezionare / deselezionare i valori:

 @model IEnumerable @using (Html.BeginForm()) { @Html.EditorForModel()  } 

e infine il modello dell’editor ( ~/Views/Home/EditorTemplates/ItemViewModel.cshtml ):

 @model AppName.Models.ItemViewModel // Those two hidden fields are just to persist the id and name @Html.HiddenFor(x => x.Id) @Html.HiddenFor(x => x.Name) 
@Html.CheckBoxFor(x => x.Checked) @Html.LabelFor(x => x.Checked, Model.Name)
 public class MoreInfo { public Int64 Id {get; set;} public string Name { get; set; } public bool Checkbox {get; set;} } 

Azione controller:

 public ActionResult Index(){ var list = new List{ new MoreInfo{Id = 1, Name = "Name1", Checkbox = false}, new MoreInfo{Id = 2, Name = "Name2", Checkbox = false}, new MoreInfo{Id = 3, Name = "Name3", Checkbox = true}, }; return View(list); } [HttpPost] public ActionResult Index(List lists){ return View(lists); } 

Vista del razor:

 @model List 
@for (var i = 0; i < Model.Count();i++ ) { @Html.HiddenFor(it => it[i].Id) @Html.TextBoxFor(it => it[i].Name) @Html.CheckBoxFor(it => it[i].Checkbox) }

Maggiori informazioni qui

è così facile:
1. creare la class checkbox con id stringa e valore bool.
2. metti la lista delle checkbox nel metodo del controller con un nome.
3. crea 2 campi dynamicmente nella tua vista ma assicurati di essere conforms al sistema di denominazione dei motori del razor.

per creare una lista di checkbox dynamic devi capire come funziona il motore del razor, diciamo che hai questo codice
nella testa della vista includi un modello come questo:

 @model MyProject.Site.Models.MyWebModel 

quel modello ha una class di impostazione che ha dentro un bool in questo modo:

 public class MyWebModel { public HighchartsSettingModel Settings { get; set; } } public class HighchartsSettingModel { public bool JoinSameType{ get; set; } } 

e nella vista hai:

 @Html.CheckBoxFor(x => x.Settings.JoinSameType) 

in breve questo crea il seguente codice html:

   

Finora tutto bene per il CheckBoxFor, che fa parte del framwork, come lavoriamo con gli array?


quindi ora tutto ciò che dobbiamo fare è capire come lavorare con la lista in un metodo di controllo, diciamo che hai questa class:

 public class Checkbox{ public string Id { get; set; } public bool Value { get; set; } } 

e nel controller hai questo:

 public ActionResult SensorSearch(List selectedSensors, string search, string subSearch, string page, string back) 

e la vista sarà così:

 @{ int counter = 0; string id_name, id_id, value_id, value_name; } @foreach (var item in Model.SensorList) { id_id = "selectedSensors_" + counter + "__Value"; id_name = "selectedSensors[" + counter + "].Value"; value_id = "selectedSensors_" + counter + "__Id"; value_name = "selectedSensors[" + counter + "].Id"; counter++; 
  • }

    non dimenticare il modulo nella vista:

     @using (Html.BeginForm("SensorSearch", "Home", Model.PageNav.StayRouteValues, FormMethod.Post, new Dictionary() { { "data-ajax", "false" }, { "id", "sensor_search_form" } })) 

    ora la pagina renderizzata sarà simile all’aspetto checkbox:

     
  • quello che devi notare sono i nomi dati alla casella di controllo input e l’input-hidden lo abbiamo usato in modo simile al modo in cui il motore del razor crea il nome e quindi dopo aver inviato il motore lo renderà come un array e quindi potrai creare qualsiasi casella di controllo dynamic elenca dove vuoi tu stesso come faresti in qualsiasi altra lingua (ad esempio php e così …).

    è così facile: è così facile:
    1. creare la class checkbox con id stringa e valore bool.
    2. metti la lista delle checkbox nel metodo del controller con un nome.
    3. crea 2 campi dynamicmente nella tua vista ma assicurati di essere conforms al sistema di denominazione dei motori del razor.

    Speravo che mi aiutasse.