Question

我需要从网格和要突出显示的选定单元格中删除选定的行hightlight（黄色）。它只需要简单明了。由于我正在处理cell highlight的功能，我不想突出显示该行。

我尝试使用以下event，

beforeSelectRow: function(rowid, e) {
    return false;
},

但我的event

  onCellSelect: function (rowid,iCol,cellcontent,e) {

                },

没有被解雇。

当我尝试使用以下css时，

.ui-state-highlight, .ui-widget-content .ui-state-highlight, .ui-widget-header .ui-state-highlight
{
    border: 1px solid red !important; // Desirable border color
    background: none !important; // Desirable background color
    color: black !important; // Desirable text color
}

所选行的边框在每个单元格上显示红色，而浅灰色的行高亮显示不好看。

我需要一个简单的正确的wa来摆脱行突出显示并突出显示所选的单元格。

Answer 1

http://jsfiddle.net/nitincool4urchat/yNw3C/9234/

添加

.ui-state-highlight{
     border:none!important;
    background:none!important;
}

删除默认突出显示。

Answer 2

return false中beforeSelectRow的使用是阻止选择行的正确方法。如果您当前使用onCellSelect，则可以在onCellSelect中移动beforeSelectRow的代码或从onCellSelect致电beforeSelectRow。您只需要的$.jgrid.getCellIndex或cellIndex属性即可获取行中单元格的索引。代码如下所示：

beforeSelectRow: function (rowid, e) {
    var $td = $(e.target).closest("td"),
        iCol = $.jgrid.getCellIndex($td[0]),
        onCellSelect = $(this).jqGrid("getGridParam", "onCellSelect");

    if ($.isFunction(onCellSelect)) {
        onCellSelect.call(this, rowid, iCol, $td.html(), e);
    }

    return false;
}

Answer 3

我有一个类似的解决方案，但我只是在加载后以编程方式删除了突出显示类。根据您具有的配置，单击单元格时可能会触发不同的事件，因此您可能需要将此功能添加到多个事件（onSelectCell，beforeEditCell，onSelectRow）。除非设置hoverrows:false，否则这将删除突出显示的所有行以及我获得的hoverrow效果。

function(rowId) {
   var row=$('#'+rowId);
   row.removeClass('ui-state-highlight');
   row.removeClass('ui-state-hover);
   row.find('.ui-state-highlight').removeClass('ui-state-highlight');
   row.find('.ui-state-hover).removeClass('ui-state-hover);
}

删除jqGrid中选定的行突出显示

3 个答案: