How do I reference a specific cell in kendo grid with javascript?
In kendoGrid each data is represented by array of objects in which one array element is one row. Kendo adds uid property to all dataObjects in array. So one dataObject looks like:
var dataItem = {
MetricName: "some-val",
DailyActual: "some-val",
DailyTarget: "some-val",
MTDActual: "some-val",
MTDTarget: "some-val",
YTDActual: "some-val",
YTDTarget: "some-val",
uid: "uid-val"
};
Now to get this data row you can simply use:
var grid = $("#gaugeMetricTable").data("kendoGrid");
var row = grid.find("tr[data-uid=" + dataItem.uid + "]");
Next to get one of this cell by index you can write:
var cellIndex_1 = 5;
var cell_1 = row.find("td:eq(" + cellIndex_1 + ")");
To get one cell by property name you have to know it's index first, e.g. if you want to get cell corresponding to MTDActual property:
var cellName = "MTDActual";
var cellIndex_2 = grid.element.find("th[data-field = '" + cellName + "']").index();
var cell_2 = row.find("td:eq(" + cellIndex_2 + ")");
EDIT:
This code can be used for both regular grid and grid with locked columns:
var cellName = "MTDActual";
var grid = $("#gaugeMetricTable").data("kendoGrid");
var headerCells = grid.element.find("th");
var cellIndex = headerCells.index(grid.element.find("th[data-field = '" + cellName + "']"));
var rowCells = grid.element.find("tr[data-uid=" + dataItem.uid + "] td");
var cell = $(rowCells[cellIndex]);
Kendo DOJO example: https://dojo.telerik.com/oDUpuTAw