2009-11-13 11 views

Antwort

54

Versuchen Sie, die folgenden CSS:

.ui-jqgrid tr.jqgrow td { 
     white-space: normal !important; 
    } 

Dies funktioniert für mich mit jqGrid 3.6.


Wie N30 wies darauf hin, jqGrid 4.0 unterstützt jetzt eine cellattr colModel Option, die für eine feinere Korn der Kontrolle über Textumbruch zulassen. Von seinem Beispiel:

cellattr: function (rowId, tv, rawObject, cm, rdata) { 
    return 'style="white-space: normal;"'; 
} 
27

Mit jqGrid 4.0, ein besserer Weg, dies zu tun ist cellattr in colmodel wie folgt zu verwenden: -

colModel: [ 
      { name: 'ClientName', label: 'Client', index: 'ClientName', width: 150, cellattr: function (rowId, tv, rawObject, cm, rdata) { return 'style="white-space: normal;"' } }, 

      .... other columns 

      ] 

Auf diese Weise können Sie Umbruchart auf einzelne Spalte anwenden können und muss nicht verwenden! wichtig

4

Ich hatte dieses Problem für die Header und fand ich brauchte all dies, um es auch in IE zu beheben. Beachten Sie, dass dies für die Header, nicht für die Zellen gilt. Das Problem dabei ist, dass es wahrscheinlich mehr Auswirkungen hat als Sie vielleicht wollen (wie ich sicher bin, werde ich später entdecken), aber Sie können die CSS-Selektoren immer verfeinern und/oder sie auf den spezifischen #tableIdName oder eine bestimmte Klasse verweisen lassen Opt-in, wie Sie möchten.

.ui-jqgrid .ui-jqgrid-htable th div { 
overflow: visible !important; 
height: auto !important; 
} 

.ui-th-column, .ui-jqgrid .ui-jqgrid-htable th.ui-th-column { 
    white-space: normal !important; 
} 

.ui-jqgrid .ui-th-div-ie{ 
    white-space: normal !important; 
} 
0

können Sie verwenden, um die classes colModel Option eine CSS-Klasse auf der Spalte zu setzen und dann in der CSS-Datei der Stil white-space: normal !important; auf dieser Klasse setzen ...

Klassen

Zeichenfolge

Diese Option ermöglicht das Hinzufügen von Klassen zur Spalte. Wenn mehr als eine Klasse verwendet wird, sollte ein Leerzeichen gesetzt werden. Mit Beispiel classes:'class1 class2' wird eine Klasse1 und eine Klasse2 für jede Zelle in dieser Spalte festgelegt.

Im Raster css gibt es eine vordefinierte Klasse ui-ellipsis, mit der Ellipsen an eine bestimmte Zeile angehängt werden können. Auch das wird in FireFox funktionieren.