Question

要获取当前所选行的行信息，我们可以执行此操作

 var current = e.sender.dataItem(e.sender.select());

但是当我点击编辑按钮时如何获得相同的结果？

我试过$("#grid").data("kendoGrid").dataItem($(e.sender).closest("tr"));它没有用。

修改

我按照以下答案的建议尝试了方法，但它仍然给我null。在屏幕截图中，评论代码无法正常工作

完整代码

＆＃13;

<script src="http://kendo.cdn.telerik.com/2016.3.914/js/kendo.all.min.js"></script>
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title>Kendo UI Snippet</title>
    <link rel="stylesheet" href="http://kendo.cdn.telerik.com/2016.3.914/styles/kendo.common.min.css" />
    <link rel="stylesheet" href="http://kendo.cdn.telerik.com/2016.3.914/styles/kendo.rtl.min.css" />
    <link rel="stylesheet" href="http://kendo.cdn.telerik.com/2016.3.914/styles/kendo.silver.min.css" />
    <link rel="stylesheet" href="http://kendo.cdn.telerik.com/2016.3.914/styles/kendo.mobile.all.min.css" />
    <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
    <!--<script src="http://kendo.cdn.telerik.com/2016.3.914/js/kendo.all.min.js"></script>-->
    <!--<script src="http://kendo.cdn.telerik.com/2016.3.914/js/kendo.all.min.js"></script>-->
    <script src="Scripts/KendoUI.js" type="text/javascript">
</head>
<body>
    <div id="grid">
    </div>
    <script>
        $("#grid").kendoGrid({
            columns: [
    { field: "id" },
    { field: "name" },
    { field: "age" },
    { command: "edit" },
    { command: "list" }
  ],
            dataSource: {
                data: [
      { id: 1, name: "Jane Doe", age: 30 },
      { id: 2, name: "John Doe", age: 33 }
    ],
                schema: {
                    model: {
                        id: "id",
                        fields: {
                            "id": { type: "number" }
                        }
                    }
                }
            },
            editable: "popup",
            toolbar: ["create"],
            dataBound: function (e) {

                //<input name="age" class="k-input k-textbox" type="text" data-bind="value:age">
            },
            edit: function (e) {
                //This currentItem is null :( 
                var currentItem = $("#grid").data("kendoGrid").dataItem($(e.sender).closest("tr"));


                if (!e.model.isNew()) {
                    $('.k-window-title').text("Newton Sheikh");
                }
            }
        });
    </script>
</body>
</html>

＆＃13;

Answer 1

如果您在网格中使用edit功能，则可以使用以下命令访问处于编辑模式的数据项属性：

var grid = $("#yourGrid").kendoGrid({
    dataSource: yourGridDatasource,        
    ...                
    edit: function (e) {
        var attribute = e.sender.dataItem(e.container).attributeName;
        // or simply
        var attribute2 = e.model.attributeName;
    }
});

Answer 2

您应该使用e.container代替e.sender，如下所示：

$("#grid").data("kendoGrid").dataItem($(e.container).closest("tr"))

更新以使其与弹出窗口一起使用

如果您使用弹出编辑器，那么容器将是弹出窗口，上面的内容将不起作用。

在这种情况下，您可以使用行的uid在表格中找到它：

var row = $("#grid").data("kendoGrid").tbody.find("tr[data-uid='" + e.model.uid + "']");

如果您不需要对实际行的引用，只需要引用数据项，那么您只需使用e.model即可。我已经使用您的代码创建了一个道场，如果您在点击＆＃34;编辑＆＃34;后检查控制台，您会看到没有区别：http://dojo.telerik.com/iqAPO

Answer 3

var gridDataById= $("#grid").data("kendoGrid");   
//Getting selected row
var selectedRow = gridDataById.dataItem(gridDataById.select());
console.log(selectedRow);

获取Kendo Grid的编辑按钮单击的行信息

3 个答案: