model-view-controller - Telerik MVC Grid - 使用下拉菜单更新“不可编辑”字段
问题描述
当我使用内联下拉列表拉出其中一个字段时,我设置了一个网格。
我可以从下拉列表数据项中检索我需要的值,并且可以使用下拉列表在网格的编辑行中设置值。
只要 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)
)
</p>
这对于我正在尝试做的事情已经足够了,但我不会将其标记为答案。
我更希望有一个格式化为货币的标签......但我遇到了编辑器模板在模型中传递的方式问题。
解决方案
在 Telerik 社区的帮助下,我找到了更好的解决方案。
首先,我们将模型中的字段保留为可编辑:
model.Field(p => p.A);
model.Field(p => p.B);
model.Field(p => p.C);
然后在列绑定中,我们将可编辑设置为始终返回 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'));
到目前为止,这为我提供了我正在寻找的功能。
推荐阅读
- mongodb - 在猫鼬中定义时间属性
- python - 在操作列表或字符串时,最有效的迭代方法是什么?
- r - 如何在数学上转换 ggplot 中图例上的默认标签?
- java - 使用 JAR 中的文件,同时从 jar 中运行应用程序
- amazon-s3 - s3 presinged url nginx反向代理错误 - SignatureDoesNotMatch
- android - 在已编译的应用程序中运行 Flutter builder runner
- python - X.shape[1] 大小不符合预期值
- django - 通过分组在Django中显示数据
- azure - OAuth 同意表单是否需要 Azure 的 User.Read 权限?
- google-api - Google Admin SDK:报告 API 活动:观看 > 发送相同通知的音调