Kendo UI下拉列表显示为文本框

Question

这是我已插入Kendo网格的带有下拉菜单的网格代码：

@model Portal.Web.Areas.Orders.Models.IngressoMerceViewModel

@(Html.Kendo().Grid<Portal.Web.Areas.Orders.Models.IngressoMerceGridViewModel>()
    .Name("grid")
    .Events(e => e.DataBound(@<text>function() {for (var i = 0; i @Html.Raw("<") this.columns.length; i++) {this.autoFitColumn(i);}}</text>))
.Columns(columns =>
{
    columns.Template("<input type='checkbox' />");
    columns.Bound(p => p.Posizione).Title("Posizione").Width(200);
    columns.Bound(p => p.Materiale).Title("Materiale").Width(200);
    columns.Bound(p => p.Description).Title("Testo breve").Width(200);
    columns.Bound(p => p.WarehouseLogicStore).Editable("false").Width(200)
               .ClientTemplate(Html.Kendo().DropDownList()
               .Name("WHLogicValue").DataTextField("Code").DataValueField("Code").DataSource(source =>
               {
                   source.Read(read =>
                   {
                       read.Action("WarehouseLogicTypes_Read", "IngressoMerce");
                   });
               }).ToClientTemplate().ToString()

               ); ;
    columns.Bound(p => p.Quantity).Title("Qta Ordine").Width(200);
    columns.Bound(p => p.UnitOfMeasure).Title("UM").Width(200);
    columns.Bound(p => p.ReceivedQty).Title("Qta già ricevute").Width(200);
    columns.Template("<input type='text' />").Title("Qta ricevute");
    columns.Bound(p => p.InProgressQtyCheck).Title("Qta da ricevere").Width(200);
    columns.Bound(p => p.ExpectedDeliveryDate).Format("{0:dd/MM/yyyy}").Title("Data consegna prevista").Width(200);
    columns.Bound(p => p.QualityCheckNeeded).Title("Check qualitativo richiesto").Width(220);
})
.Pageable()
.Sortable()
.Scrollable()
.HtmlAttributes(new { style = "height:430px;" })
.DataSource(dataSource => dataSource
.Ajax()
//.Read(read => read.Url("/orders/details").Type(HttpVerbs.Get))
.Read(read => read.Action("OrderDetails_Read", "IngressoMerce", Model))
)
.Deferred(!Model.IsAjax)
)

不幸的是，该下拉列表显示为文本框，并且ASP.net MVC控制器中的相应操作未触发。这是该操作的代码：

[AllowAnonymous]
    public async Task<JsonResult> WarehouseLogicTypes_Read()
    {
        try
        {
            var types = await gateway.GetWarehouseLogicTypes();

            return Json(types);
        }
        catch (Exception ex)
        {
            //logger.LogError(ex.Message);
            throw ex;
        }
    }

Answer 1

您可以使用EditorTemplates在Kendo网格中插入下拉列表

您的索引视图代码应像这样

@(Html.Kendo().Grid<DemoApplication.Models.ProductsModel>()
    .Name("CategoryGrid")
    .Columns(columns =>
    {
        columns.Bound(p => p.category).ClientTemplate("#=category.CategoryName#");
        columns.Bound(c => c.ProductName);

    })
         .Editable(editable => editable.Mode(GridEditMode.InCell))
            .Scrollable()
            .Sortable()
            .Pageable(pageable => pageable
            .Refresh(true)
            .PageSizes(true)
            .ButtonCount(5))
            .DataSource(dataSource => dataSource
            .Ajax()
            .Model(model =>
            {
                model.Id(x => x.Id);
            })
            .Read(read => read.Action("ListAll", "Test"))
            .PageSize(10)
            ))