我使用 mvc 剑道网格,在那个网格中我想使用多选。不知何故,当网格获取数据时,多选值未定义,但是当我按下网格中的更新按钮时,它会为多选找到正确的值。
这是将我的网格绑定到供应商用于多选的视图模型
public class CustomerViewModel
{
public CustomerViewModel()
{
Suppliers = new List<SupplierViewModel>();
}
public int CustomerId { get; set; }
public string CustomerName { get; set; }
[StringLength(2, ErrorMessage = "CountryCode cannot be longer than 2 characters.")]
public string CountryCode { get; set; }
public string CustomerERPId { get; set; }
[UIHint("SupplierMultiEditor")]
public ICollection<SupplierViewModel> Suppliers { get; set; }
}
这是我的网格的视图:
<div>
<script type="text/kendo" id="supplierTemplate">
<ul>
#for(var i = 0; i< data.length; i++){#
<li>#:data[i].Name#</li>
#}#
</ul>
</script>
<script type="text/javascript">
var supplierTemplate = kendo.template($("#supplierTemplate").html(), { useWithBlock: false });
console.log("Supplier " + supplierTemplate);
</script>
@(Html.Kendo().Grid<CustomerViewModel>()
.Name("CustomerGrid")
.Columns(col =>
{
col.Bound(c => c.CustomerName);
col.Bound(c => c.CountryCode).Filterable(false);
col.Bound(c => c.Suppliers).ClientTemplate("#=supplierTemplate(Suppliers)#").Filterable(false);
col.Command(command =>
{
command.Edit();
command.Destroy();
}).Width(220).Title("Edit/Delete");
})
.ToolBar(toolbar =>
{
toolbar.Create();
})
.Scrollable()
.Filterable(ftb => ftb.Mode(GridFilterMode.Row))
.Sortable()
.HtmlAttributes(new { style = "height:525px" })
.Pageable(pageable => pageable
.Refresh(true)
.PageSizes(true)
.ButtonCount(5))
.DataSource(dataSource => dataSource
.Ajax()
.Model(model =>
{
model.Id(s => s.CustomerId);
model.Field(s => s.Suppliers).DefaultValue(new List<SupplierViewModel>());
})
.Create(update => update.Action("CreateCustomer", "Customer"))
.Read(read => read.Action("GetCustomers", "Customer"))
.Update(update => update.Action("SaveCustomer", "Customer"))
.Destroy(destroy => destroy.Action("RemoveCustomer", "Customer"))
)
)
<script type="text/javascript">
function serialize(data) {
debugger;
for (var property in data) {
if ($.isArray(data[property])) {
serializeArray(property, data[property], data);
}
}
}
function serializeArray(prefix, array, result) {
for (var i = 0; i < array.length; i++) {
if ($.isPlainObject(array[i])) {
for (var property in array[i]) {
result[prefix + "[" + i + "]." + property] = array[i][property];
}
}
else {
result[prefix + "[" + i + "]"] = array[i];
}
}
}
</script>
这是多选
@using CUST.Presentation.Cms.ViewModel
@using Kendo.Mvc.UI
@model IEnumerable<CUST.Presentation.Cms.ViewModel.SupplierViewModel>
@(Html.Kendo().MultiSelect()
.Name("Suppliers")
.DataTextField("SupplierName")
.DataValueField("SupplierId")
.BindTo((IEnumerable<SupplierViewModel>)ViewData["CustSuppliers"])
.Placeholder("No suppliers selected")
)