如何在jqgrid中的操作按钮之前添加按钮 [英] how add button before action buttons in jqgrid

问题描述

自定义jQGrid发布操作中的答案，使用appendTo()将自定义按钮添加到操作结束按钮).

Answer in Custom jQGrid post action adds custom button to end of action buttons using appendTo().

如何在操作按钮之前添加按钮?

How to add buttons befor action buttons ?

我尝试用before()和prepend()替换appendTo()，但是所有按钮都消失了.

I tried to replace appendTo() with before() and prepend() but in this all buttons disappear.

推荐答案

我尝试使用prependTo而不是appendTo来完成所有工作.确切地说，我使用过

I tried to use prependTo instead of appendTo and all works. To be exactly I used

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

显示相应的演示

我另外添加了CSS

.ui-inline-custom.ui-state-hover span { margin: -1px; }

对于悬停的小改进，对应

for small improvement of the hovering corresponds the the bug fix which already implemented in jqGrid 4.3.2.

更新:免费jqGrid 的当前版本支持简单实现自定义按钮的方法.参见演示.

UPDATED: The current version of free jqGrid supports easy way to implement custom buttons. See the demo.

这篇关于如何在jqgrid中的操作按钮之前添加按钮的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！