模型绑定
本地数据
本地数据是初始化multicolumcombobox时客户机上可用的数据。
将数据传递给视图
显示数据
。public ActionResult Index() {ViewData["products"] = GetProducts();return View(new ProductViewModel {ProductID = 4, ProductName = "ProductName4"});}私有静态IEnumerable
GetProducts() {var products = Enumerable。范围(0,2000)。Select(i => new ProductViewModel {ProductID = i, ProductName = "ProductName" + i});返回产品;} 将multicolumcombobox添加到视图中,并将其绑定到保存在
显示数据
。@ model MvcApplication1.Models。ProductViewModel @ (Html.Kendo()。MultiColumnComboBoxFor(m => m.ProductID) .DataValueField("ProductID") .DataTextField("ProductName") .Columns(columns => { columns.Add().Field("ProductName").Title("Product Name").Width("200px") columns.Add().Field("ProductID").Title("Product ID").Width("200px"); }) .BindTo((System.Collections.IEnumerable)ViewData["products"]) )
@ model MvcApplication1.Models。ProductViewModel @{var data = (System.Collections.IEnumerable)ViewData["products"];}
<列字段="ProductName" title="Name" width="200px"> <列字段="ProductID" title="ID" width="200px">
远程数据
您可以配置multicolumcombobox,使其通过发出AJAX请求从远程源获取数据。
创建一个将数据作为JSON结果返回的操作。
public ActionResult Index() {return View(new ProductViewModel {ProductID = 4, ProductName = "ProductName4"});}公共JsonResult GetProductsAjax() {var产品= Enumerable。范围(0,500)。Select(i => new ProductViewModel {ProductID = i, ProductName = "ProductName" + i});返回Json(products, JsonRequestBehavior.AllowGet);}
将multicolumcombobox添加到视图中,并配置其数据源以使用远程数据。
@ model MvcApplication1.Models。ProductViewModel @ (Html.Kendo()。MultiColumnComboBoxFor(m => m.ProductID) .Filter("contains") .DataTextField("ProductName") .DataValueField("ProductID") .Columns(columns => { columns.Add().Field("ProductName").Title("Product Name").Width("200px") columns.Add().Field("ProductID").Title("Product ID").Width("200px"); }) .Placeholder("Select product...") .DataSource(source => { source.Read(read => { read.Action("GetProductsAjax", "Home"); }) .ServerFiltering(false); }) )
@ model MvcApplication1.Models。ProductViewModel
<列字段="ProductName"标题="Name"宽度="200px"> <列字段="ProductID"标题="ID"宽度="200px">