自定义jQGrid后期操作

我有一个很棒的jQGrid内联编辑示例 有两个自定义操作“编辑”和“删除”

我想再添加一个自定义内联动作，让我们称之为ToggleOnline。在这个动作中，我想将网格的所有单元格发布到控制器。基本上，这是一种编辑操作，但它会为某些列设置一些默认值

添加的内联按钮如下所示：

{ name: 'act', index: 'act', width: 55, align: 'center', sortable: false, formatter: 'actions',
                        formatoptions: {
                            keys: true, // we want use [Enter] key to save the row and [Esc] to cancel editing.
                            delOptions: myDelOptions
                        }
                    }

而不是添加自定义附加按钮，我正在使用事件

loadComplete:

loadComplete: function(){ 
            debugger;
            var ids = jQuery("#Grid1").getDataIDs(); 
                for(var i=0;i<ids.length;i++){ 
                    var cl = ids[i];
                    custom = "<input style='height:22px;width:20px;' type='button' value='E' onclick=jQuery('#Grid1').editRow(" + cl + "); />";
                    jQuery("#Grid1").setRowData(ids[i], { act: custom }) 
                } 
            } 

loadComplete:function（）{
调试器；
var id=jQuery（“#Grid1”）.getDataId（）；
对于（var i=0；i我为您更新了演示。现在，我从代码中删除了第二个网格以使代码更小）：


对实现的一些注释。actions格式化程序在div中添加“action buttons”元素。每个“action button”都有如下HTML标记



因此，为了使自定义按钮的外观接近原始的“操作按钮”，我在
loadComplete
中做了如下操作：

loadComplete:函数（）{
var grid=$（此），
iCol=getColumnIndexByName（网格，'act'）；/'act'-操作列的名称
表格.儿童（“tbody”）
.儿童（“tr.jqgrow”）
.儿童（“td:n个儿童（“+（iCol+1）+”））
.each（函数（{
$("",
{
标题：“海关”，
mouseover:function（）{
$（this.addClass（'ui-state-hover'）；
},
mouseout:function（）{
$（this.removeClass（'ui-state-hover'）；
},
点击：功能（e）{
警报（“‘自定义’按钮在行中单击=”+
$（e.target）.closest（“tr.jqgrow”）.attr（“id”）+“！”；
}
}
).css（{“左边距”：“5px”，float:“left”}）
.addClass（“ui pg div ui内联自定义”）
.append（“”）
.appendTo（$（this.children）（“div”）；
});
}

在哪里

var getColumnIndexByName=函数（网格，columnName）{
var cm=grid.jqGrid（'getGridParam'，'colModel'），i=0，l=cm.length；
对于（；iIf，如果我将“动作”从左向右移动（目前是第一列，我将其设置为最后一列），在这种情况下，无法在那里看到新按钮，有什么想法吗？而且双击时，编辑和删除图标不会反映双击（不会更改）我不知道如何解决这个问题。@Joper:这很容易解释。我使用了简化代码
“td:nth child（1）”
。我更新了答案和代码以动态计算行索引。我如何删除删除内联操作？我只想保留编辑和自定义操作。顺便说一下，我在这里发布了问题