Telerik MVC Grid - 使用下拉菜单更新“不可编辑”字段答案

【问题标题】：Telerik MVC Grid - Updating "Uneditable" Fields with a Drop DownTelerik MVC Grid - 使用下拉菜单更新“不可编辑”字段
【发布时间】：2018-04-30 12:25:21
【问题描述】：

当我使用内联下拉列表拉出其中一个字段时，我设置了一个网格。

我可以从下拉列表数据项中检索我需要的值，我可以使用下拉列表在网格的编辑行中设置值。

只要 A、B、C 和 D 是可编辑的，以下代码就可以正常工作……但是……这些值不应该是可编辑的。这些单元格中的值应严格由下拉列表的值驱动。

function ddl_OnSelect(e)
{
    var DDLdataItem = this.dataItem(e.item);

    var A = DDLdataItem.A;
    var B = DDLdataItem.B;
    var C = DDLdataItem.C;
    var D = DDLdataItem.D;

    var grid = $('#grd').data('kendoGrid');

    var editRow = grid.dataItem("tr.k-grid-edit-row");


    editRow.set("A", DDLdataItem.A);
    editRow.set("B", DDLdataItem.B);
    editRow.set("C", DDLdataItem.C);
    editRow.set("D", DDLdataItem.D);

}

我觉得我应该能够在模板列中显示值，但我没有在 column.template 上找到任何好的文档，当我执行此类操作时，它只会给我一个空列。

        columns.Template(
            @<text>
                <input type="text" name="A" value="@item.A" readonly />
            </text>
                 ).Title("A");

更新

好的....所以我为“解决”问题所做的工作是...

首先，我创建了一个名为 ReadOnlyCurrency 的新编辑器模板并将其放置在共享的 EditorTemplates 中。

然后，对于这适用的 3 个货币列中的每一个，我添加了编辑器模板名称属性。

.EditorTemplateName("ReadOnlyCurrency")

然后我复制货币编辑器模板的内容并将其粘贴到只读货币模板中

我关闭了微调器，将其设为只读，并将其设为 false。

@model decimal?
@(Html.Kendo().CurrencyTextBoxFor(m => m)
      .HtmlAttributes(new { style = "width:100%;", @readonly = "readonly" })
      .Enable(false)
      .Min(0)
      .Spinners(false)
)

这对于我正在尝试做的事情已经足够了，但我不会将其标记为答案。

我更希望有一个格式化为货币的标签......但是我在编辑器模板在模型中传递的方式方面遇到了问题。

【问题讨论】：

标签： model-view-controller telerik grid

【解决方案1】：

在 Telerik 社区的帮助下，我找到了更好的解决方案。

首先，我们将模型中的字段保留为可编辑：

model.Field(p => p.A);
model.Field(p => p.B);
model.Field(p => p.C);

然后在列绑定中我们将editable设置为一个总是返回false的函数：

columns.Bound(p => p.A).Title("A").Editable("editable").ClientTemplate("<span class='A'>#: kendo.toString(A, 'C') #</span>").ClientFooterTemplate("#= kendo.toString(sum, 'C') #");
columns.Bound(p => p.B).Title("B").Editable("editable").ClientTemplate("<span class='B'>#: kendo.toString(B, 'C') #</span>").ClientFooterTemplate("#= kendo.toString(sum, 'C') #");
columns.Bound(p => p.C).Title("Total").Editable("editable").ClientTemplate("<span class='C'>#: kendo.toString(C, 'C') #</span>").ClientFooterTemplate("#= kendo.toString(sum, 'C') #");

然后在更改函数中，我们在 dataItem 中设置值，并在 clientRow 中设置客户端值。

var editRow = $("tr.k-grid-edit-row").closest("[data-role=grid]").data("kendoGrid").dataItem("tr.k-grid-edit-row");
var clientRow = $("tr.k-grid-edit-row");
editRow.set("A", this.dataItem(e.item).A);
editRow.set("B", this.dataItem(e.item).B);
editRow.set("C", this.dataItem(e.item).C);
clientRow.find(".A").text(kendo.toString(this.dataItem(e.item).A, 'C'));
clientRow.find(".B").text(kendo.toString(this.dataItem(e.item).B, 'C'));
clientRow.find(".C").text(kendo.toString(this.dataItem(e.item).C, 'C'));

到目前为止，这为我提供了我正在寻找的功能。

【讨论】：