kendo-grid - 单击行内的图像图标时获取 kendo MVC 网格行数据

Question

请找到上面的图片。在上面的第一次记录图像中，有一个历史图像。第二行没有历史图像。

所以这是我的要求。

当我单击该历史图标时，我想将资源名称、部门、项目、费用描述传递给操作并获取该记录的历史值。我想在模型弹出的网格中显示这些历史值。在我的处理程序方法中，我如何获取当前的剑道网格行数据。

下面是我的代码。

columns.Bound(p => p.HoursYTD).Width(70).Filterable(false).Editable("function() {return false;}").ClientFooterTemplate("#=kendo.toString(sum, '0,0')#").HtmlAttributes(new { style = "font-weight: bold; text-align: center;" })
 .HeaderHtmlAttributes(new { style = "white-space: normal; text-align: center;font-weight: bold;" }).
ClientTemplate("#= DisplayImage(data) #");

<script>
    function DisplayImage(product) {
        //alert(product.IsHistory);
        //alert(product.HoursYTD);
    //var action = '@Url.Action("ProductDetails", "Product")';
        if (product.IsHistory=="Yes")
            var html = kendo.format(product.HoursYTD +"<img src='/Images/" + product.IsHistory + ".png' height='22' width='22'  onclick='myHandler(event)'");
        else
            var html = kendo.format("<div>"+product.HoursYTD+"</div>");

    return html;
}
 function myHandler(e) {
    alert("hello");
}
</script> 

标签： kendo-gridkendo-asp.net-mvc

Answer 1

通过将 TR HTML 元素传递给网格的dataItem() 方法来访问底层数据项：

function myHandler(e) {
    var row = $(e.target).closest("tr");
    var dataItem = $("#grid").getKendoGrid().dataItem(row); // swap 'grid' with the name of your grid
    // access properties via dataItem.FieldName;
}