如何从窗口更新剑道网格行 [英] How to update Kendo Grid row from window

问题描述

设置:

• ASP MVC 项目
• 通过 Razor 视图中的 Kendo Grid
• 列自定义命令，调用...
• 使用 refresh() URL 打开 Kendo 窗口以作为自定义表单进行部分视图的 JavaScript
• 该表单有一个 input type=button 调用 JavaScript

障碍:

如何使用新模型(来自窗口/表单 javascript)更新 Grid 的行(dataItem?).我无法获得目标数据项的句柄.Select() 在此处不适用，因为未选择该行.相反，自定义按钮事件会打开模态网格窗口，其中包含用于更新、关闭等的字段和命令.

How to update the row (dataItem?) of Grid with new model (from window/form javascript). I am unable to get a handle to target dataItem. Select() is not applicable here because the row is not selected. Instead, a custom button event opens modal Grid Window having the fields and commands for update, close, etc..

我可以使用 Grid 的本机 Edit，但我试图完成的是一种完全自定义弹出窗口的方法，该窗口显示可用于呈现 CRUD 操作的部分视图.

I could use the native Edit of Grid, but what I am trying to accomplish is a way to have complete customization of a pop up window showing partial view that can be used to present CRUD actions.

顺便说一句:这样做的理由是优化网格行中的空间，这些空间通常会被不必要的按钮用于编辑和删除，这些按钮是通过使用 Kendo 本机控件属性放置的.就我而言，我觉得这最好在单独的详细信息视图中呈现，例如模型网格窗口.

BTW: Rationale for this is to optimize space in a grid row that would normally be consumed with unnecessary buttons for Editing, and Deleting, layed down by use of the Kendo native control properties. I feel this is better presented in a separate, details view, like a Model Grid Window, in my case.

同样，不使用 Select()，我无法理解如何在 Window/form JavaScript 中获取调用它的 Grid 行的句柄，以便用新模型数据更新该行.

Again, not using Select(), I am unable to understand how to get a handle, within the Window/form JavaScript, to the Grid row that it was called from, for purposes of updating the row with new model data.

感谢您的时间.

推荐答案

使用你的方法你正在做双重请求，所以我的建议是:在编辑时打开一个通过 MVVM 绑定到行的窗口:

Using your method you are doing double request so my suggesting: On edit open a window binded to row via MVVM :

function edit(e) {
    //get the row which belongs to clicked edit button
    var item = this.dataItem($(e.currentTarget).closest("tr"));

    //bind the window to the item via mvvm http://docs.telerik.com/kendo-ui/framework/mvvm/overview 
    kendo.bind($("#window"), item);
}

该窗口包含一个编辑器模板 (Shared/EditorTemplates/Client.cshtml) :

The window contain an editor template (Shared/EditorTemplates/Client.cshtml) :

@(Html.Kendo().Window().Name("window")
    .Title("Client Details")
    .Visible(false)
    .Modal(true)
    .Draggable(true)
    .Width(400)
    .Content(@<text>
        @Html.Partial("EditorTemplates/Client", new Product())
    </text>))

//Put in every element in the window data-bind="value:INPUT NAME" 
//<input name="price" /> become <input name="price" data-bind="value: price" />
$("#window [name]").each(function () {
     var name = $(this).attr("name")
     $(this).attr("data-bind", "value:" + name );
 });

编辑器模板:

@model Product
@Html.TextBoxFor(m => m.Name)

这篇关于如何从窗口更新剑道网格行的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！