jqGrid行交替背景

2

function applyZebra(containerId) { 
    $('#' + containerId + ' tr:nth-child(even)').addClass("jqgrow evenTableRow"); 
    $('#' + containerId + ' tr:nth-child(odd)').addClass("jqgrow oddTableRow"); 
}

ContainerId是您的jqGrid ID。在jqGrid的“gridComplete”事件中调用此方法。

来源

2009-11-22 08:36:25 Nrj

+0

的最佳解决方案，但如果奇/偶颜色可以从选择这将是很好jQuery UI主题。 – 2009-11-22 15:55:39

-1

Here's how you do it：

$("#myGrid").jqGrid({ 
    ... 
    gridComplete: function() { 
     var _rows = $(".jqgrow"); 
     for (var i = 0; i < _rows.length; i += 2) { 
      _rows[i].attributes["class"].value += " alt"; 
     } 
    } 
});

来源

2009-11-23 11:24:24 Graviton

+0

*方式*工作太多。该功能已经内置到网格中。没有必要重塑它。 – 2009-11-23 22:22:04

9

看那altRows和altclassoptions。谨防通常不一致的大写！如果您使用的是jqGrid 3.5或更高版本，这会使用jQuery UI主题。

来源

2009-11-23 22:30:35

2

要使用jQuery UI的主题使用以下代码：

$('#'+gridName+' tr:nth-child(even)').removeClass("ui-priority-secondary"); 
$('#'+gridName+' tr:nth-child(odd)').addClass("ui-priority-secondary");

我使用这个代码时，我执行手工分拣（拖动正压降）

来源

2010-02-18 15:44:04

0

你好首先定义的CSS：

<style type="text/css"> 
...... 
.Color_Red { background:red; } 
.Color_Cyan { background:cyan; } 
......

中的jqGrid 则...

$("#list2").jqGrid({ 
........ 
loadComplete: function() { 
    var rowIDs = jQuery("#list2").getDataIDs(); 
    for (var i=0;i<rowIDs.length;i=i+1){ 
    rowData=jQuery("#list2").getRowData(rowIDs[i]); 
    var trElement = jQuery("#"+ rowIDs[i],jQuery('#list2')); 

// Red  
    if (rowData.Estado == 0) { 
     trElement.removeClass('ui-widget-content'); 
     trElement.addClass('Color_Red'); 
    } 

// Cyan   
    if (rowData.Estado == 2) { 
     trElement.removeClass('ui-widget-content'); 
     trElement.addClass('Color_Cyan'); 
    } 
} 
}, 

});

因此我们走行和应用RED以满足条件== 0和青色这满足条件== 2。

您应该更改rowData.XXX == XX按列名和值来检查。

我有这种方式，它完美的作品。

好运！

来源

2012-10-09 22:27:55 Javier

0

调用loadComplete函数来更改jqgrid中行的背景颜色。

loadComplete : function() { 
    $("tr.jqgrow:odd").addClass('myAltRowClassEven'); 
    $("tr.jqgrow:even").addClass('myAltRowClassOdd'); 
},

将样式应用到css后面的使用。

<style type="text/css"> 
.myAltRowClassEven { background: #E0E0E0; border-color: #79B7E7; } 
.myAltRowClassOdd { background: orange; } 
</style>

或者

对于jqGrid的改变一行字体看到点击以下链接

How can I change Background colour and Font of any row in JQGrid?

来源

2014-03-19 12:12:00 pudaykiran

jqGrid行交替背景

回答

相关问题