ExtJS 4 - Wie hinzufügen von Hintergrundfarben zu Spalten eines Rasters?

Ich habe eine grid, in denen ich brauche, um verschiedene Hintergrundfarben zu verschiedenen Spalten.

Diese Spalte, die Farben sollten auch nicht überschrieben werden durch die mouse-over Farbe.

Habe ich versucht, mit cls und tdCls aber kein Glück.

Konnte jemand ein Handbuch auf, wie dies erreicht werden?

Vielen Dank im Voraus.

  • Ich war in der Lage, eine Lösung zu finden für diese. Ich Schaffe eine renderer-Funktion für jede Spalte, und ich bin setzen der Metadaten, die etwa so aussieht: renderer : function(Wert, Metadaten-Datensatz, rowIndex, colIndex, store){ //Metadaten.tdCls = 'lookUpClass'; Metadaten.style = 'background:#EBEBF5'; return Wert; } Wenn tdCls, seine Anwendung von Farbe, um Alternative Zeilen und nicht jeder einzelne. Hoffe, dies ist die Möglichkeit, eine hintergrund-Farbe und kann sein, dass das jemandem hilft. Wenn keine bessere Möglichkeit, bitte teilen.
InformationsquelleAutor netemp | 2011-09-16
  1. 5

    NetEmp ist hier richtig, Sie wollen einen renderer, und Sie möchten, nutzen Sie den direkten "Stil" - Methode, oder ich habe es unten mit dem folgenden:

    function greyRenderer(lpValue, opMeta, opData) 
{

    if (opData.data["Condition"] == 0) {
        opMeta.attr = "style='color: #aaa';";
    }

    lpValue = Ext.util.Format.htmlEncode(lpValue); 
    return lpValue;
}

    Hinweis: hier prüfe ich den Wert für die Zeile in ein bestimmtes Feld und wenden Sie dann die Farbe für die Vordergrund-text-und html-Kodierung der Ausgabe, kann man offensichtlich wechseln Sie einfach Dinge zu Ihrem spezifischen Anforderungen.

    • Warum nicht die opMeta.style-Eigenschaft?
    • Wie ich bereits in der Antwort, Sie könnte verwenden Sie die style-Methode, aber, dass die renderer nur einen musste ich treten. Wir waren nicht mit ExtJS4 an der Zeit, und ich glaubt', attr', das war die einzige Möglichkeit, Stil - docs.sencha.com/ext-js/3-4/#!/api/...
    InformationsquelleAutor dougajmcdonald
  2. 2

    fügen Sie diese an beliebige Spalte, die Sie wollen, um Farbe zu ändern

    renderer:function(value,metaData){
    metaData.style="background-color:#EAA8A8";
    return value;
},
    InformationsquelleAutor Eme
  3. 1

    Brauchen Sie nicht einen renderer, der für diese. Was passiert, ist, dass ExtJS s zebra striping Stil (x-grid-row-alt) und mouse-over-Stil Vorrang vor dem Stil, den Sie definiert in tdCls. Hinzufügen !important auf die Hintergrundfarbe und es wird funktionieren. Zum Beispiel:

    .my-column-style {
    background-color: blue !important;
}
    InformationsquelleAutor ivern
Schreibe einen Kommentar