GRID中的列客户端模板

时间:2018-05-21 17:42:21

标签: asp.net-mvc asp.net-core kendo-ui kendo-grid kendo-asp.net-mvc

我正在将应用程序从MVC 5迁移到Core 2.0。我们遇到了网格客户端模板的问题,因为当我们将它与editable属性一起使用时,我们无法使用它。以下是代码。

@(Html.Kendo().Grid<PPVR>()
    .Name("PPVRGird")
    .Columns(columns =>
    {
        columns.Bound(e => e.Id).Hidden();
        columns.Bound(c => c.Name);
        columns.Bound(c => c.Quantity);
        columns.Bound(c => c.Type);
        columns.Bound("").ClientTemplate("<div style='text-align:center'><a href='javascript:void(0)' class='k-grid-edit custom-action-button'onclick='customGridEditClick(this)'><img src='/Content/edit.svg' width ='40' height='40'/><br/>Edit</a></div>").HeaderHtmlAttributes(new { @class = "custom-action-button" }).Title("Edit").Width(150);
        columns.Bound("").ClientTemplate("<div style='text-align:center'><a href='javascript:void(0)' class='custom-action-button pull-center' onclick='deletePayPerViewRules(#=Id#)'><img src='/Content/trashed.svg' width='40' height='40' /><br />Delete</a></div>").HeaderHtmlAttributes(new { @class = "custom-action-button" }).Width(200);
        })
        .Pageable()
        .HtmlAttributes(new { style = " text-align:left; font-family:lato; font-size:16px; " })
        .DataSource(dataSource => dataSource
        .Ajax()
        .PageSize(100)
        .Read(read => read.Action("GetPPVR", "PPV"))
        .Model(model =>
        {
            model.Id(u => u.Id);
            model.Field(u => u.Type).Editable(false);
        })
        .Update(update => update.Action("UpdatePPVR", "PPV")))
        .Editable(editable => editable.Mode(GridEditMode.InLine))
)

这会带来空白页面。当我评论 .Editable(editable =&gt; editable.Mode(GridEditMode.InLine))页面时,会显示该页面。它在MVC 5中运行良好,但在核心2.0中运行不佳。

请建议我如何实现这一目标。

更新 =&gt;只有在我使用“弹出”时使用“内联”选项进行编辑才会出现此问题,然后才能正常工作。

1 个答案:

答案 0 :(得分:0)

好的,等了2天后,我收到了Telerik团队的回复。

一种可能的解决方案是将所需列绑定到任何字段,并使用columns.editable配置来防止编辑这些列。 https://docs.telerik.com/kendo-ui/api/javascript/ui/grid/configuration/columns.editable

columns.Bound(p => p.Freight).ClientTemplate("Hi").HeaderHtmlAttributes(new { @class = "custom-action-button" }).Width(200).Editable("function(){return false;}");
columns.Bound(p => p.Freight).ClientTemplate("Bye").HeaderHtmlAttributes(new { @class = "custom-action-button" }).Title("Sample").Width(150).Editable("function(){return false;}");

Telerik Team Answer

这对我来说似乎是一种解决方法,但它运作良好。

希望这个问题能节省一些人的时间。