0

我正在使用剑道 ui 网格来显示数据。我想为网格设置标题。有什么方法可以设置它。

另外我想为网格设置一些额外的/自定义属性,这将有助于唯一地识别网格。我可以将任何自定义属性设置为网格,以便在需要时获取它的值。

因此,如果网格上有更多实例,这将有所帮助。

请就此提出建议。

4

2 回答 2

1

可以使用以下方法遍历所有表:

$.each($(".k-grid"), function (idx, grid) {
    // Do whatever you want to do with "grid"
    ...
});

如果要添加标题,可能类似于:

$.each($(".k-grid"), function (idx, grid) {
    $(grid).data("kendoGrid").wrapper.prepend('<div class="k-grid-header"><table><thead><tr><th class="k-header">Title</th></tr></thead></table></div>');
});

要为 HTMLimg元素设置点击事件,您可以执行以下操作:

$("tr", ".k-grid").on("click", "img:first", function () {
    // Here "this" is the "img" on which you clicked, finding the grid is:
    var grid = $(this).closest(".k-grid").data("kendoGrid");
    console.log("grid", grid);
    // If you want to access the "id"
    console.log("id", grid.element.attr("id"));
});

单击每一行的第一张图像后,我在事件处理程序中所做的就是找到最接近的具有k-grid类的 HTML 元素(网格):这是包含网格的 HTML。

如果你想获得 Kendo UIgrid元素,你需要使用data("kendoGrid").

简单而优雅。

在这个 JSFiddle: http: //jsfiddle.net/OnaBai/2qpT3/2/中,如果您单击“添加标题”按钮,则为每个表添加标题,如果单击“添加处理程序”,然后单击图像,您将收到id图像所属表的警报。

编辑:如果您想迭代文档上每个 KendoUI 网格的第一列中的每个图像,您应该这样做:

$.each($("td:first > img", ".k-grid table tbody > tr"), function (idx, elem) {
    // "elem" is the image
    console.log(idx, elem);
    // associate event
    $(elem).on("click", fnHandler);
});
于 2013-05-16T07:26:31.813 回答
0

我更喜欢这样更改标题:

$("#grid th[data-field=Field]").html("Title");
于 2016-03-07T18:56:34.707 回答