如何使用JavaScript引用kendo網格中的特定單元格？

現在我有一個2行6列的劍道網格。我需要一些邏輯來突出特定的單元格，但我不知道如何引用單元格。我用這個例子，但我不知道該傳入什麼作爲id。如何使用JavaScript引用kendo網格中的特定單元格？

myHub.client.highlightRow = function (id) { 
    var data = $("#MyGrid").data("kendoGrid").dataSource.data(); 
    for (var i = 0; i < data.length; i++) { 
     var dataItem = data[i]; 
     if (dataItem.id == id) { 
      //alert(dataItem.uid); 
      $("#MyGrid").data("kendoGrid").tbody.find("tr[data-uid=" + dataItem.uid + "]").effect("highlight", { color: "#f35800" }, 3000); 
     } 
    } 
};

這是我的網格示例。

function loadGaugeTable(siteId, dashboardId, endDate, planType) { 
    var today = new Date(); 
    var metricTitle = "Metric, as of " + monthNames[today.getMonth()] + " " + today.getDate(); 
    var containerSize = $("#gaugeMetricTableContainer").width(); 
    var apiPath = "/" + getAppPath() + "/Analytics/api/DashboardApi/getAllMetricTDData" + "?siteId=" + siteId + 
                        "&dashboardId=" + dashboardId + 
                        "&endDate=" + escape(endDate) + 
                        "&planType=" + planType 

    $("#gaugeMetricTable").kendoGrid({ 

     attributes: { 
      "class": "table-cell", 
      style: "font-size: 10px" 
     }, 
     height: 250, 
     selectable: "row", 
     scrollable: true, 
     sortable: true, 
     filterable: true, 
     columns: [ 
      { field: "MetricName", title: metricTitle, width: containerSize/4 + "px" }, 
      { field: "DailyActual", title: "Daily Actual", format: decimalPrecisionFormat }, 
      { field: "DailyTarget", title: "Daily Target", format: decimalPrecisionFormat }, 
      { field: "MTDActual", title: "MTD Actual", format: decimalPrecisionFormat }, 
      { field: "MTDTarget", title: "MTD Target", format: decimalPrecisionFormat }, 
      { field: "YTDActual", title: "YTD Actual", format: decimalPrecisionFormat }, 
      { field: "YTDTarget", title: "YTD Target", format: decimalPrecisionFormat } 

     ], 
     dataSource: { 
      transport: { 
       read: { 
        dataType: "json", url: apiPath 
       } 
      } 
     }, 

    }); 
}

我怎麼會去引用說第1行，第2列。

var data = $("#gaugeMetricTable").data("kendoGrid").dataSource.data(); 
data[0];

返回的數據行，但我不能用數據[0] .columns引用該列的[1 ]。

來源

2015-06-18 Curious Cat

你對頁面中的網格有一些標記嗎？ – StuperUser

感謝您的回覆我剛剛更新了初始帖子 –

一種方法是使用行或單元格模板：http://dojo.telerik.com/@ezanker/ugIFo – ezanker

在kendoGrid中，每個數據由一個數組元素爲一行的對象數組表示。 Kendo將uid屬性添加到數組中的所有數據對象。所以一個dataObject時的樣子：

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" 
};

我們得到這個數據行，你可以簡單地使用：

var grid = $("#gaugeMetricTable").data("kendoGrid"); 
var row = grid.find("tr[data-uid=" + dataItem.uid + "]");

下一頁通過指數來獲得這個小區的一個，你可以寫：

var cellIndex_1 = 5; 
var cell_1 = row.find("td:eq(" + cellIndex_1 + ")");

要獲得一個單元格的屬性名稱，您必須先知道它是否爲索引，例如，如果要獲取對應於的單元格MTDActual屬性：

var cellName = "MTDActual"; 
var cellIndex_2 = grid.element.find("th[data-field = '" + cellName + "']").index(); 
var cell_2 = row.find("td:eq(" + cellIndex_2 + ")");

注意：如果您想要將它與凍結列一起使用，您必須輕微修改單元格獲取方法。

來源

2015-06-19 18:41:16

這正是我所期待的。我無法找到.find的文檔。非常感謝！ –

這爲我工作：

function onChange(arg) { 
     var cell = this.select(); 
     var cellIndex = cell[0].cellIndex; 
     var column = this.columns[0]; 
     ...

的細胞的DE值在0列，例如，從選定行是：

var mydata = dataItem[column.field];

快樂編碼KendoGrid。

來源

2016-09-21 21:25:53 user3220499

如何使用JavaScript引用kendo網格中的特定單元格？

回答

相關問題