Kendo UI Grid 外键列为空

Question

我尝试按照示例将外键放入网格中。我遵循了这个例子：

http://demos.telerik.com/aspnet-mvc/grid/foreignkeycolumn

我稍微修改了一下，因为我想使用Popup Editor。

这是View 中的Grid 实现。

@(Html.Kendo().Grid<Example.Web.UI.ViewModels.ExampleItem>()
.Name("ExampleGrid")
.Columns(columns =>
{
    columns.Bound(p => p.Name);
    columns.Bound(p => p.Label);
    columns.Bound(p => p.Type);
    columns.Bound(p => p.InputType);

    columns.ForeignKey(p => p.ParentId, (System.Collections.IEnumerable)ViewData["items"], "Id", "Name").Title("Parent");

    columns.Command(command => { command.Edit(); command.Destroy(); });
})
.Scrollable()
.Groupable()
.Sortable()
.Pageable(pageable => pageable
    .Refresh(true)
    .PageSizes(true)
    .ButtonCount(5))

.ToolBar(toolbar => toolbar.Create())
.Editable(editable => editable.Mode(GridEditMode.PopUp))
.DataSource(dataSource => dataSource
    .Ajax()
    .PageSize(20)
    .Events(events => events.Error("error_handler"))
    .Model(model =>
            {
                model.Id(p => p.Id);
                model.Field(p => p.Id).DefaultValue(Guid.NewGuid());
                model.Field(p => p.ParentId).DefaultValue(null);
            })
    .Create(update => update.Action("EditingPopup_Create", "Example"))
    .Read(read => read.Action("EditingPopup_Read", "Example"))
    .Update(update => update.Action("EditingPopup_Update", "Example"))
    .Destroy(update => update.Action("EditingPopup_Destroy", "Example"))
)
)

这是ExampeItem 型号：

public class ExampleItem
{
    [ScaffoldColumn(false)]
    public Guid Id { get; set; }

    public string Name { get; set; }

    public string Label { get; set; }

    public string Type { get; set; }

    [DisplayName("Input Type")]
    public string InputType { get; set; }

    public ExampleItem Parent { get; set; }

    public Guid ParentId { get; set; }
}

在我的Controller 中，我这样设置外键项：

ViewData["items"] = exampleItems; // This is a List<ExapleItem>

但由于某种原因，Grid 加载时Parent 列为空。

当我点击Edit 时，会弹出一个窗口并显示父级的 Guid。

Guid 应该是项目的下拉列表。而Parent 列应显示Parent 项目的名称。

此网格的想法是您可以将项目添加到网格中，并且当您这样做时，您可以选择所有已添加的网格项目中的任何一个作为父项。然后在Grid 中创建一个层次结构，稍后可以通过Parent 对其进行排序。

有人知道我哪里出错了吗？

Answer 1

不确定，但根据我的经验，您忘记为外键列添加编辑器模板。

1. 根据您的代码，您必须将默认编辑器模板添加到您的项目中。

   • 有关默认编辑器模板的详细信息，请查看this 以获取完整代码/演示。

2. 您还可以创建自己的编辑器模板。 例如：-

产品的列定义

c.ForeignKey(x => x.ProductID, (List<Product>)ViewData["products"], "ID", "ProdName").EditorTemplateName("ProductIDEditor");

这是 Product 的编辑器模板 ProductIDEditor.cshtml

@using Kendo.Mvc.UI

@(Html.Kendo().DropDownListFor(m => m)
                  .AutoBind(false)
                  .OptionLabel("Select a value...")
                  .DataTextField("ProdName")
                  .DataValueField("ID")
                  .DataSource(dataSource =>
                  {
                      dataSource.Read(read => read.Action("FilterProducts", "Home").Data("filterProducts"))
                                .ServerFiltering(true);
                  })                                   
            )
            @Html.ValidationMessageFor(m => m)

如果有任何问题，请告诉我。

Answer 2

所以经过反复试验，我发现了问题。

我将模型更改为：

public class ProposalItem
{
    [ScaffoldColumn(false)]
    public int Id { get; set; }

    public string Name { get; set; }

    public string Label { get; set; }

    public string Type { get; set; }

    [DisplayName("Input Type")]
    public string InputType { get; set; }

    public ProposalItem Parent { get; set; }

    [UIHint("GridForeignKey")]
    public int? ParentId { get; set; }
}

因此从Id 中删除了Guid 数据类型。还用[UIHint("GridForeignKey")] 装饰了ParentId，现在在弹出窗口中给了我一个DropdownList。

KendoUI 中似乎缺少对 Guid 的支持。

我将发布另一个关于为什么 Guid 不起作用的问题。

Answer 3

只需添加：

.DataSource(source => source.Ajax()
            .Model(model =>
            {
                model.Id(o => o.Id);
                model.Field(o => o.Id).Editable(false);
                model.Field(p => p.Id).DefaultValue(Guid.NewGuid());

                model.Field(p => p.ParentId).DefaultValue(Guid.NewGuid());

                **model.Field("ParentId", typeof(Guid));**
            })

它必须做新的Guid。