Question

我一直在寻找这方面的帮助，这应该非常简单，但我无法找到我需要的东西。这是我的jsFiddle，它包含一个超级基本的Kendo网格。我只想在单击按钮时获取当前所选行的所有数据（使用一列单选按钮）。

我知道当选择一行时，它正在改变css类中的属性。因此，我尝试检索的行将具有属性：

.detailGridRowSelector:checked

我设法使用复选框（而不是单选按钮）实现第一行并计算检查了多少行，但由于某种原因我无法访问数据！

var dataSource = {
data: [
    {
    "first": "Adam",
    "last": "Paul"},
    {
    "first": "Shannon",
    "last": "Harris"},
    {
    "first": "Frank",
    "last": "Rolinson"},
    ]
};

var columns = [
    {
        template:'<input type="radio" class="detailGridRowSelector" title="Select Lines" name="radioLineSelector" />', width: 20
        },
    {
field: "first",
title: "First Name",
width: "90px"},
{
field: "last",
title: "Last Name",
width: "90px"},
];

    $("#grid1").kendoGrid({
    dataSource: dataSource,
    columns: columns,
});

$("#getInfoButton").bind("click", function () {

    var lineData ="line data would be set here";
    //I know the selected row has the property: .detailGridRowSelector:checked
    alert(lineData);

});

Answer 1

你应该这样做：

// Get a reference to the grid
var grid = $("#grid1").data("kendoGrid");
// Get checked row by getting the input and then the row containing the input
var row = $("input:checked", grid.tbody).closest("tr");
// Get the item
var item = grid.dataItem(row);
// Format and display item
alert (JSON.stringify(item));

您的JSFiddle在此修改：http://jsfiddle.net/OnaBai/HTXua/414/

Answer 2

<强>解决

事实证明我对自己这么做太过分了。我刚刚了解到Kendo有一个内置的功能可以为你处理这个问题，所以我没有使用一列单选按钮，而是将其删除并实现了

selectable: 'row'

特征。然后我就用

来搞定

var grid = $("#grid1").data("kendoGrid");
var row = grid.select();
var data = grid.dataItem(row);
alert(data.first);

Kendo Grid：使用选中的单选按钮从行中获取所有数据

2 个答案: