Kendo ui 网格背景中的下拉列表和不同颜色的文本

我正在尝试使用column.Bound在telerik mvc网格中添加dropdownlist。我可以让dropdownlist显示，但最初它显示为文本框。显然，如果我使用编辑器模板，它应该可以工作，但我得到的错误值不能为null

其目的是在网格中显示dropdownlist，每个项目将具有不同的文本颜色和背景。这需要通过模型属性填充

目前，我使用ViewData只是为了让事情正常运行，但没有乐趣。建议这可以通过模板完成

你知道为什么这样不行吗

@using System.Collections.Generic;
@model IEnumerable<TelerikChecklist.Models.ProductViewModel>


@(Html.Kendo().Grid(Model)
.Name("gridDropDown")
.Columns(columns =>
{
    columns.Bound(p => p.ProductName);
    //columns.ForeignKey(p => p.CategoryID,     (System.Collections.IEnumerable)ViewData["categories"], "CategoryID", "CategoryName")
    //  .Title("Category")
    //  .Width(150);

    columns.Bound(p => p.CategoryID).Title("Category Name").ClientTemplate((@Html.Kendo().DropDownList()
        .Name("dropdown_#=CategoryID#")
        .BindTo((System.Collections.IEnumerable)ViewData["categories"])
        .DataTextField("CategoryName")
        .DataValueField("CategoryID")
        .ValueTemplate("")
        .ToClientTemplate().ToString()
        )).EditorTemplateName("GridForeignKey");

})
    .Editable(editable => editable.Mode(GridEditMode.InCell))
    .Pageable()
    .Scrollable()
    .HtmlAttributes(new { style = "height:250px;" })

    .DataSource(dataSource => dataSource
        .Ajax()
        .Batch(true)
        .PageSize(20)
        .ServerOperation(false)
        .Events(events => events.Error("errorHandler"))
        .Model(model =>
        {
            model.Id(p => p.ProductID);
            model.Field(p => p.ProductID).Editable(false);
            model.Field(p => p.CategoryID).DefaultValue(1);
        })

        .Read(read => read.Action("ForeignKeyColumn_Read", "Home"))
        .Update(update => update.Action("ForeignKeyColumn_Update", "Home")).Events(e => e.Change("Category"))
        .Create(create => create.Action("ForeignKeyColumn_Create", "Home"))
        .Destroy(destroy => destroy.Action("ForeignKeyColumn_Destroy", "Home"))



    )

---

通过创建另一个模板解决：

columns.Bound(p => p.Category.CategoryName).Title("CategoryName").EditorTemplateName("GridForeignKey2");

@使用系统集合

@(Html.Kendo().DropDownList()
        .Name("NeatProperty")
        .DataTextField("CategoryName")
        .DataValueField("CategoryID")
        .BindTo((System.Collections.IEnumerable)ViewData["categories"])
        .Template("<div style='background-color:#: data.CategoryColor #'><span class=\"k-state-default\"></span>" + "<span class=\"k-state-default\"><p style='color:#: data.CategoryTextColor #;'>#: data.CategoryName #</p></span></div>")
        .ValueTemplate("<div style='background-color:#: data.CategoryColor #;'><span>#:data.CategoryName#</span></div>")

@（Html.Kendo（）.DropDownList（））
.名称（“NeatProperty”）
.DataTextField（“CategoryName”）
.DataValueField（“类别ID”）
.BindTo（（System.Collections.IEnumerable）ViewData[“categories”]）
.Template（“+”
#：data.CategoryName
”）
.ValueTemplate（“#：数据.CategoryName#”）

)

---

在stackoverflow上的另一篇文章中看到了这一点，但丢失了链接，因此无法发布。

通过更新GridForeignKey以接受Ienumerable而不是select列表，修复了空值。使用下面的链接获得了要显示的网格：

@(Html.Kendo().DropDownList()
        .Name("NeatProperty")
        .DataTextField("CategoryName")
        .DataValueField("CategoryID")
        .BindTo((System.Collections.IEnumerable)ViewData["categories"])
        .Template("<div style='background-color:#: data.CategoryColor #'><span class=\"k-state-default\"></span>" + "<span class=\"k-state-default\"><p style='color:#: data.CategoryTextColor #;'>#: data.CategoryName #</p></span></div>")
        .ValueTemplate("<div style='background-color:#: data.CategoryColor #;'><span>#:data.CategoryName#</span></div>")