当jqGrid中的行处于内联编辑模式时,jquery选择器访问最后一个单元格(最后一行的最后一列)

时间:2013-03-15 12:17:37

标签: jqgrid

想要在jqGrid中的最后一个单元格的tab键上添加keydown事件以添加新行。 当行处于内联模式时,请帮助我将keydown事件仅附加到网格的最后一个单元格。 这是获得lastrow的选择器

var lastRow = $('#grid>tbody>tr.jqgrow:last');
  1. 如何指定最后一行的最后一列选择器。
  2. 请建议动态绑定此类事件。
  3. 放置此绑定事件代码的位置会更好,就像在loadComplete中一样。

2 个答案:

答案 0 :(得分:0)

loadcomplete上获得最后一行,然后在最后一列中添加一个类。然后,您可以向此添加一个jQuery事件处理程序,以侦听tab键以触发添加新记录功能。

大致如何理解:

获取行的ID:

var rowIds = $(grid).jqGrid('getDataIDs').length;

如果您知道最后一个列名称可以使用它,或者如果您知道,则可以获得colNames数组的长度。

var lastCol = $(grid).jqGrid('getGridParam', 'colNames').length;

然后通过以下方法将类设置为最后一行中的最后一个col:

$(grid).jqGrid('setCell', rowIds, lastCol, "", 'TabTriggerClass');

从那里你应该在最后一行的最后一列上有一个类,你只需绑定一个事件处理程序,然后绑定add函数等。

答案 1 :(得分:0)

这就是我使用您的解决方案的方式

var bindEventToLastCell = function(){
    jQuery(".TabTriggerClass").on('keydown', function(e){
        if (e.which == 9 && jQuery(e.currentTarget).hasClass('TabTriggerClass')) {

            $(this).removeClass('TabTriggerClass');
            $(this).off(e);
            //Performing other actions
        }
    });
};

var addTabTriggerClassToLastCell = function(grid) {
    var lastRowId = jQuery('#' + jQuery(grid).attr('id') + '>tbody>tr.jqgrow:last').attr('id');
    var lastCol = getLastEditableColumnIndex(grid);
    grid.setCell(lastRowId, lastCol, "", 'TabTriggerClass');
};