This example demonstrates how to use data editors in bound and unbound modes to edit Model fields.
Overview
Use the editor's PreRender property to specify multiple selected items based on the enumerable Model field.
Razorsettings.PreRender = (sender, e) => { ASPxCheckBoxList cbl = (ASPxCheckBoxList)sender; foreach(ListEditItem item in cbl.Items) { item.Selected = Model.ProgLanguages.Contains((int)item.Value); } };
Call the editor's GetSelectedValues method to get multiple selected items on the Controller side. To obtain Model fields from the corresponding editor, use a DevExpressEditorsBinder object.
C#public ActionResult Index([ModelBinder(typeof(DevExpressEditorsBinder))] MyModel model) {
model.ProgLanguages = CheckBoxListExtension.GetSelectedValues<int>("ProgLanguagesUnbound");
TempData["PostedModel"] = model;
return RedirectToAction("Success");
}
Files to Review
Does this example address your development requirements/objectives?
(you will be redirected to DevExpress.com to submit your response)
Example Code
C#using System;
using System.Collections;
using System.Collections.Generic;
using System.Web.Mvc;
using System.Xml.Linq;
using DevExpress.Web.Mvc;
namespace CS.Controllers {
public class HomeController : Controller {
public ActionResult Index() {
MyModel model = new MyModel() {
Name = "User Name",
Language = 14,
ProgLanguages = new int[] { 10, 12, 14 }
};
ViewData["ProgLanguageItems"] = GetProgLanguageItems();
return View(model);
}
[HttpPost]
public ActionResult Index([ModelBinder(typeof(DevExpressEditorsBinder))] MyModel model) {
//Manually Bound Field - CheckBoxList (multi select)
model.ProgLanguages = CheckBoxListExtension.GetSelectedValues<int>("ProgLanguagesUnbound");
TempData["PostedModel"] = model;
return RedirectToAction("Success");
}
public ActionResult Success() {
return View(TempData["PostedModel"]);
}
private IList GetProgLanguageItems() {
List<CheckBoxListItemObject> items = new List<CheckBoxListItemObject>();
XDocument document = XDocument.Load(Server.MapPath("~/App_Data/ProgLanguages.xml"));
foreach(var item in document.Root.Elements("ProgLanguage")) {
items.Add(new CheckBoxListItemObject() {
ID = Convert.ToInt32(item.Attribute("ID").Value),
Name = (string)item.Attribute("Name").Value
});
}
return items;
}
}
public class MyModel {
public string Name { get; set; }
public int? Language { get; set; }
public int[] ProgLanguages { get; set; }
}
public class CheckBoxListItemObject {
public int ID { get; set; }
public string Name { get; set; }
}
}
Razor@model CS.Controllers.MyModel
@using(Html.BeginForm()) {
<b>Automatically Bound Field - TextBox</b>
<br />
<br />
@Html.DevExpress().TextBox(
settings => {
settings.Name = "Name";
}).Bind(Model.Name).GetHtml()
<br />
<br />
<br />
<b>Automatically Bound Field - RadioButtonList (single select)</b>
<br />
<br />
@(Html.DevExpress().RadioButtonList(settings => {
settings.Name = "Language";
settings.Properties.ValueField = "ID";
settings.Properties.TextField = "Name";
settings.Properties.ValueType = typeof(int);
settings.Properties.RepeatLayout = System.Web.UI.WebControls.RepeatLayout.Table;
settings.Properties.RepeatDirection = System.Web.UI.WebControls.RepeatDirection.Horizontal;
settings.Properties.RepeatColumns = 5;
})
.BindToXML(HttpContext.Current.Server.MapPath("~/App_Data/Languages.xml"), "//Language")
.Bind(Model.Language)
.GetHtml()
)
@Html.DevExpress().Button(settings => {
settings.Name = "btnUnselectRadioButtonList";
settings.Text = "Unselect All";
settings.ClientSideEvents.Click = "function(s, e) { Language.SetValue(null); }";
}).GetHtml()
<br />
<br />
<br />
<b>Manually Bound Field - CheckBoxList (multi select)</b>
<br />
<br />
@(Html.DevExpress().CheckBoxList(settings => {
settings.Name = "ProgLanguagesUnbound";
settings.Properties.ValueField = "ID";
settings.Properties.TextField = "Name";
settings.Properties.ValueType = typeof(int);
settings.Properties.RepeatLayout = System.Web.UI.WebControls.RepeatLayout.Table;
settings.Properties.RepeatDirection = System.Web.UI.WebControls.RepeatDirection.Horizontal;
settings.Properties.RepeatColumns = 5;
settings.PreRender = (sender, e) => {
ASPxCheckBoxList cbl = (ASPxCheckBoxList)sender;
foreach(ListEditItem item in cbl.Items) {
item.Selected = Model.ProgLanguages.Contains((int)item.Value);
}
};
})
.BindList(ViewData["ProgLanguageItems"])
.GetHtml()
)
<table>
<tr>
<td>
@Html.DevExpress().Button(settings => {
settings.Name = "btnSelectCheckBoxList";
settings.Text = "Select All";
settings.ClientSideEvents.Click = "function(s, e) { ProgLanguagesUnbound.SelectAll(); }";
}).GetHtml()
</td>
<td>
@Html.DevExpress().Button(settings => {
settings.Name = "btnUnselectCheckBoxList";
settings.Text = "Unselect All";
settings.ClientSideEvents.Click = "function(s, e) { ProgLanguagesUnbound.UnselectAll(); }";
}).GetHtml()
</td>
</tr>
</table>
<br />
@Html.DevExpress().Button(settings => {
settings.Name = "btnSubmit";
settings.UseSubmitBehavior = true;
settings.Text = "Submit";
}).GetHtml()
}