网格内的 Kendo UI DropBox 不起作用答案

【问题标题】：Kendo UI DropBox inside a grid not working网格内的 Kendo UI DropBox 不起作用
【发布时间】：2013-11-08 14:44:12
【问题描述】：

您好，任何人都可以帮助我解决我的代码问题。两天以来我一直在尝试如何在网格中添加下拉列表我正在尝试修复我的代码但我无法找出为什么下拉框没有显示在我的网格中我的代码是

<%: Html.Kendo().Grid<KendoGridAjaxEditing2.Models.ProductViewModel>()
    .Name("grid")
          .Columns(columns =>
          {
              columns.Bound(product => product.CustomerID).Width(100);
              columns.Bound(product => product.CustomerName).ClientTemplate("#=Category.CustomerFName#").Width(160);
              columns.Bound(product => product.CustomerLastName);
              columns.Bound(product => product.Customerage).Width(250);


              columns.Command(commands =>
              {
                  commands.Edit(); // The "edit" command will edit and update data items
                  commands.Destroy(); // The "destroy" command removes data items
              }).Title("Commands").Width(200);
          })
          .ToolBar(toolbar => toolbar.Create()) // The "create" command adds new data items
          .Editable(editable => editable.Mode(GridEditMode.InLine)) // Use inline editing mode
          .DataSource(dataSource =>
              dataSource.Ajax()
                .Model(model =>
                {
                    model.Id(product => product.CustomerID); // Specify the property which is the unique identifier of the model
                    model.Field(product => product.CustomerID).Editable(false); // Make the ProductID property not editable
                    model.Field(p => p.Category).DefaultValue(
                          ViewData["defaultCategory"] as KendoGridAjaxEditing2.Models.ClientCategoryViewModel);

                })
                .Create(create => create.Action("Products_Create", "Home")) // Action invoked when the user saves a new data item
                .Read(read => read.Action("Products_Read", "Home"))  // Action invoked when the grid needs data
                .Update(update => update.Action("Products_Update", "Home"))  // Action invoked when the user saves an updated data item
                .Destroy(destroy => destroy.Action("Products_Destroy", "Home")) // Action invoked when the user removes a data item
          )
          .Pageable()
%>

和 HomeController 方法

 private void PopulateCategories()
    {
        var dataContext = new NorthwindEntities();
        var categories = dataContext.Customer_details
                    .Select(c => new ClientCategoryViewModel
                    {
                         ID = c.ID,
                         CustomerFName = c.name
                    })
                    .OrderBy(e => e.CustomerFName);
        ViewData["categories"] = categories;
        ViewData["defaultCategory"] = categories.First();
    }

   public ActionResult Index()
    {
        ViewBag.Message = "Welcome to ASP.NET MVC!";
       PopulateCategories();
        return View();
    }

和我的 ClientCategoryViewModel 类

 public class ClientCategoryViewModel
{

    public int ID { get; set; }
    public string CustomerFName { get; set; }
}

当我尝试 .ClientTemplate("#=Category.CustomerFName#").Width(160);在我看来，我没有得到任何结果，但是一旦我删除它，我的网格正在显示记录，但我无法理解为什么我没有在我的网格中获得下拉菜单，我在过去 2 到 3 天尝试这个，但我无法找出解决方案我试图将此链接作为指南http://demos.kendoui.com/web/grid/editing.html 但问题仍然存在请有人帮助我谢谢

【问题讨论】：

标签： asp.net-mvc asp.net-mvc-3 grid kendo-ui kendo-grid

【解决方案1】：

ClientTemplate 用于显示模式，编辑模式需要创建 DropDownList 编辑器。检查以下主题以获取 more information。如果您按照那里的说明进行操作，则应该可以正常工作。

【讨论】：

我无法显示，它显示为文本框，并且您发送的链接未与网格链接我是 mvc 中的新手，所以我需要帮助

【解决方案2】：

您需要使用 columns.ForeignKey 如本演示所示：http://demos.kendoui.com/web/grid/foreignkeycolumn.html

确保您拥有 GridForeignKey.cshtml 编辑器模板。（通常位于 Views\Shared\EditorTemplates 中）

您很可能希望将其绑定到您的 CustomerId 而不是名称。我通常绑定到一个 IEnumerable。出于某种原因，Kendo 让您告诉它“值”是值列，而“文本”是文本列，即使它们不会让您为正常的非网格下拉菜单这样做。

如果您需要让它为空，请将其绑定到以下几行：

private IEnumerable<SelectListItem> PaymentTermsList
        {
            get
            {
                if (paymentTermsList == null)
                {
                    paymentTermsList = 
                        new [] { new SelectListItem(){ Value = "-1", Text = "(None)" } }.Concat(
                            referenceDataService.GetActivePaymentTerms()
                                .Select(pt => new SelectListItem() { Value = pt.PaymentTermId.ToString(), Text = pt.Name }));
                }
                return paymentTermsList;
            }
        }

【讨论】：