kendo multiselect in grid not binding correct

Question

即時通訊使用mvc kendo網格，並在該網格中我想使用多選。不知何故，當網格取得數據時，說的是多選值的未定義，但是當我按下網格中的更新按鈕時，它會爲多選選項找到正確的值。

這裏是視圖模型IM我網結合到供應商是多選

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") 
) 

Answer 1

評分過低，但我認爲你可能需要更改kendo腳本。

<script type="text/kendo" id="supplierTemplate"> 
<ul> 
    #for(var i = 0; i< data.length; i++){# 
    <li>#:data[i].Name#</li> 
    #}# 
</ul> 

它遍歷數組中，這種情況下是一個SupplierViewModel中的所有項目，我懷疑它不會有一個名爲「名稱」屬性。將數據[i] .Name更改爲要顯示的屬性，並且該屬性應該起作用，它看起來像是SupplierName;所以data [i] .SupplierName。