Question

Here是一个在jQgrid的Actions列中添加自定义图标的演示。在我的情况下，如果我添加3行gridComplete被调用3次。所以我在第1行获得3个自定义图标，第2行有2个自定义图标，第3行有1个。无论如何我们可以添加基于行和列的自定义图标???

gridComplete: function () {
                var iCol = getColumnIndexByName(grid, 'act');
                $(this).find(">tbody>tr.jqgrow>td:nth-child(" + (iCol + 1) + ")")
                    .each(function() {
                        $("<div>", {
                            title: "Custom",
                            mouseover: function() {
                                $(this).addClass('ui-state-hover');
                            },
                            mouseout: function() {
                                $(this).removeClass('ui-state-hover');
                            },
                            click: function(e) {
                                alert("'Custom' button is clicked in the rowis="+
                                    $(e.target).closest("tr.jqgrow").attr("id") +" !");
                            }
                        }
                      ).css({"margin-right": "5px", float: "left", cursor: "pointer"})
                       .addClass("ui-pg-div ui-inline-custom")
                       .append('<span class="ui-icon ui-icon-document"></span>')
                       .prependTo($(this).children("div"));
                });
            }

Answer 1

查看为the modified demo创建的the answer。它使用jqGrid 4.4.4，但相同的代码（参见the demo）也适用于jqGrid 4.5.2。

Answer 2

我认为该行存在错误：

$(this).find(">tbody>tr.jqgrow>td:nth-child(" + (iCol + 1) + ")")

应该是

$(this).find("tbody>tr.jqgrow>td:nth-child(" + (iCol + 1) + ")")

（删除tbody之前的“＆gt;”）

使用onclick事件向jqgrid操作列添加自定义图标

2 个答案: