【问题标题】:kendo multiselect in grid not binding correct网格中的剑道多选未绑定正确
【发布时间】:2014-10-17 08:20:27
【问题描述】:

我使用 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")
  )

【问题讨论】:

    标签: c# asp.net-mvc grid kendo-asp.net-mvc kendo-multiselect


    【解决方案1】:

    评分太低,无法评论,但我认为您可能需要更改剑道脚本。

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

    它循环遍历数组中的所有项目,在这种情况下是 SupplierViewModel,我怀疑它没有名为“Name”的属性。将 data[i].Name 更改为您要显示的任何属性,它应该可以工作,看起来像是 SupplierName;所以data[i].SupplierName。

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多