jqGrid Reihe wechselnden Hintergrund

2

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

ContainerId ist Ihre jqGrid ID. Rufen Sie diese Methode für das Ereignis "gridComplete" Ihres jqGrid auf.

Quelle

2009-11-22 08:36:25 Nrj

+0

Große Lösung, aber es wäre schön, wenn die gerade/ungerade Farben ausgewählt werden könnte das jQuery UI-Design. –

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

Quelle

2009-11-23 11:24:24 Graviton

+0

* Weg * zu viel Arbeit. Diese Funktion ist bereits im Grid integriert. Keine Notwendigkeit, es neu zu erfinden. –

9

Blick auf die altRows und altclassoptions. Vorsicht vor der typischerweise inkonsistenten Großschreibung! Dies verwendet das jQuery UI-Design, wenn Sie jqGrid 3.5 oder höher verwenden.

Quelle

2009-11-23 22:30:35

2

Um die jQuery UI-Thema verwenden diesen Code zu verwenden:

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

ich diesen Code verwenden, wenn I Handsortierung (Drag-and-Drop)

Quelle

2010-02-18 15:44:04

0

die CSS Hallo definiert zuerst auszuführen:

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

Dann in 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'); 
    } 
} 
}, 

});

So gehen wir die Reihen und gelten RED die Bedingung zu erfüllen, die 0 und Cyan == die dem Zustand == 2 erfüllen.

Sie sollten rowData.XXX == XX nach Spaltennamen und Wert zu überprüfen.

Ich habe es so und es funktioniert perfekt.

Glück!

Quelle

2012-10-09 22:27:55 Javier

0

Rufen Sie die Funktion loadComplete auf, um die Hintergrundfarbe der Zeile in jqgrid zu ändern.

zum Anwenden von Stilen auf den Hintergrund verwenden Sie unter CSS.

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

Oder

Für Zeile Schriftart in jqGrid Ändern sehen Sie im folgenden Link

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

Quelle

2014-03-19 12:12:00 pudaykiran

Antwort

Verwandte Themen