原文出处:
https://stackoverflow.com/questions/17343371/how-to-get-row-index-and-cell-index-of-row-click-kendo-grid
示例1:
示例2:
演示 : http://jsfiddle.net/OnaBai/MuDX7/
html
示例1:
function onDataBound(e) {
var grid = $("#Grid").data("kendoGrid");
$(grid.tbody).on("click", "td", function (e) {
var row = $(this).closest("tr");
var rowIdx = $("tr", grid.tbody).index(row);
var colIdx = $("td", row).index(this);
alert(rowIdx + '-' + colIdx);
});
}
$(document).ready(function () {
$("#Grid").kendoGrid({
dataSource: {
type: "odata",
transport: {
read: "http://demos.kendoui.com/service/Northwind.svc/Orders",
dataType: "jsonp"
},
schema: {
model: {
fields: {
OrderID: { type: "number" },
Freight: { type: "number" },
ShipName: { type: "string" },
OrderDate: { type: "date" },
ShipCity: { type: "string" }
}
}
},
pageSize: 10,
serverPaging: true,
serverFiltering: true,
serverSorting: true
},
dataBound: onDataBound,
filterable: true,
sortable: true,
pageable: true,
columns: [{
field: "OrderID",
filterable: false
},
"Freight",
{
field: "OrderDate",
title: "Order Date",
width: 120,
format: "{0:MM/dd/yyyy}"
}, {
field: "ShipName",
title: "Ship Name",
width: 260
}, {
field: "ShipCity",
title: "Ship City",
width: 150
}
]
});
});
<div id="Grid"></div>
示例2:
演示 : http://jsfiddle.net/OnaBai/MuDX7/
html
<div id="grid"></div>
js
var grid = $("#grid").kendoGrid({
dataSource: {
data : createRandomData(300),
pageSize: 10,
schema : {
id : "Id",
model: {
fields: {
Id : { type: 'number' },
FirstName: { type: 'string' },
LastName : { type: 'string' }
}
}
}
},
selectable: true,
editable : false,
pageable : {
refresh : true,
pageSizes: true
},
columns : [
{ template: "<img style='width:16px' src='http://www.onabai.es/images/digits/1.png'", width: 90},
{ field: "FirstName", width: 90, title: "First Name" },
{ field: "LastName", width: 90, title: "Last Name" }
]
}).data("kendoGrid");
$(grid.tbody).on("click", "td", function (e) {
var row = $(this).closest("tr");
var rowIdx = $("tr", grid.tbody).index(row);
var colIdx = $("td", row).index(this);
var item = grid.dataItem(row);
var id = item.Id;
alert("row:" + rowIdx + " col:" + colIdx + " id:" + id + "\nitem:" + JSON.stringify(item, null, 4));
});