Kendo Grid 外键列动态绑定答案

【问题标题】：Kendo Grid Foreign key column bind dynamicallyKendo Grid 外键列动态绑定
【发布时间】：2014-01-27 13:17:48
【问题描述】：

@(Html.Kendo().Grid((IEnumerable<Doc.Web.Models.Common.ContactModel>)Model.contact_lst)  
    .Name("grid")
    .Columns(columns =>
    {

        columns.Bound(o => o.ContactID).Visible(false);
        columns.Bound(o => o.ContactName).Title("Contact Name");
        columns.ForeignKey(p => p.CPOID, (System.Collections.IEnumerable)ViewData["CPOs"], "cpo_id", "contract_po")
                .Title("Company - Contact/Purchase Order");
        columns.Command(command => { command.Edit(); command.Destroy(); }).Width(182);
    })
    .ToolBar(toolbar => toolbar.Create())
    .Editable(editable => editable.Mode(GridEditMode.InLine))
    .Pageable()
    .Sortable()
    .Filterable()
    .ToolBar(toolbar =>
    {
        toolbar.Template(@<text>
           <div class="toolbar">
               <a href="/Contact/EditingInline_Read?grid-mode=insert" class="k-button k-button-icontext k-grid-add">
    <span class="k-icon k-add"></span>Add New Record
</a>
                    <label class="category-label" for="category">Site:</label>
                       @(Html.Kendo().DropDownListFor(m => m.SiteID)
                            .Name("SiteID")
                            .DataTextField("Text")
                            .DataValueField("Value")
                            .Events(e => e.Change("categoriesChange"))
                            .Value(Model.SiteID.ToString())
                            .DataSource(ds =>
                            {
                                ds.Read("ToolbarTemplate_Categories", "Contact");
                            })
                        ) 

                        </div>

        </text>);
    })
    .DataSource(dataSource => dataSource
        .Ajax()
        .PageSize(20)
        .Events(events => events.Error("error_handler"))
        .Model(model => model.Id(p => p.ContactID))
        .Create(update => update.Action("EditingInline_Create", "Contact").Data("additionalInfo"))
        .Read(read => read.Action("EditingInline_Read", "Contact").Data("additionalInfo"))
        .Update(update => update.Action("EditingInline_Update", "Contact").Data("additionalInfo"))
        .Destroy(update => update.Action("EditingInline_Destroy", "Contact").Data("additionalInfo"))

    )
)

我想在标题模板上的 SiteID 下拉列表的更改事件中重新绑定外键列值。我在“EditingInline_Read”事件中尝试过，但 ViewBag 值没有更新。有什么建议？

【问题讨论】：

标签： kendo-ui telerik kendo-grid

【解决方案1】：

剑道网格不支持动态重新绑定。您可以获得的最接近的东西是定义自定义编辑器模板它使用 AJAX 绑定数据。

columns.ForeignKey(p => p.CPOID, 
(System.Collections.IEnumerable)ViewData["CPOs"], "cpo_id", "contract_po")
.Title("Company - Contact/Purchase Order")
.EditorTemplateName("RemoteForeignKey");

RemoteForeignKey 编辑器模板

@model int

@(Html.Kendo().DropDownListFor(m => m)
  .DataSource(source =>
  {
      source.Read(read =>
      {
          read.Action("actionName", "controllerName").Type(HttpVerbs.Post).Data("dataFunc");
      }).ServerFiltering(false);
  })
  .DataValueField("cpo_id")
  .DataTextField("contract_po")
)

dataFunc javascript 函数

function dataFunc () {
    return {
        SiteID: $("#SiteID").val() // here we pass the site ID to server
    };
}

和您的服务器功能

[AcceptVerbs(HttpVerbs.Post)]
public JsonResult actionName(int? SiteID)
{
    if (SiteID != null)
    {
        var objects = (from obj in db.tableName
                       where obj.SiteID == SiteID.Value
                       select new
                       {
                           cpo_id = obj.cpo_id,
                           contract_po = obj.contract_po
                       }).ToList().Distinct().OrderBy(obj => obj.contract_po);
            return Json(objects);
    }
    return null;
}

然后您的下拉列表中的值将被 SiteID 输入的当前值过滤。

【讨论】：