在
Custom jQGrid post action中的答案使用appendTo()将自定义按钮添加到操作结束按钮.
如何为动作按钮添加按钮？
我试图用before()和prepend()替换appendTo()但是在这里所有按钮都消失了.
解决方法
我试图使用prependTo而不是appendTo,所有的工作.准确地说我用过
loadComplete: 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"));
});
}
相应的demo显示
我另外添加了CSS
.ui-inline-custom.ui-state-hover span { margin: -1px; }
对于悬停的小改进,对应于已在jqgrid 4.3.2中实现的the bug fix.
更新：当前版本的free jqGrid支持简单的方法来实现自定义按钮.见the demo.