ExtJS: Jak zawijać tekst w ListView za pomocą kolumn?

Question

Mam ExtJSListView sterowania z 4 kolumnami. Jedna z kolumn zawiera tekst, który rozszerza szerokość kolumny, a więc część tekstu znajduje się pod następną kolumną.

Jak mogę ustawić white-space do normal dla komórek w ListView?

Answer 1

ta powinna być w definicji kolumny:

{ 
    header: 'Besked', 
    dataIndex: 'besked', 
    tpl: '<p style=\"white-space:normal\";>{besked}</p>' 
} 

Answer 2

Sdavids solution prace i głosowałem za to.

Ale na wszelki wypadek wolisz użyciu klasę css zamiast stylów ten sposób:

{ 
    header: 'Besked', 
    dataIndex: 'besked', 
    cls: 'listViewColumnWrap' 
} 

Następnie trzeba tę linię w jakimś pliku css:

.listViewColumnWrap { white-space:normal; } 

Answer 3

ten to sposób na przeglądarkę, aby zastąpić domyślne klasy css, aby wszystkie widoki listy, siatki i listy wyboru combobox obejmowały całą zawartość tekstową:

.x-list-body dt {white-space: normal;} 
.x-list-body dt em { white-space: pre-wrap !important; word-wrap: break-word !important;} 
.x-grid3-row-flag { white-space: normal; background-color: #ffc; } 
.x-grid3-cell-inner, .x-grid3-hd-inner{ white-space: normal; } 
.x-grid3-cell-inner { white-space: pre-wrap !important; word-wrap: break-word !important;} 
.x-combo-list-inner .x-combo-list-item { white-space: normal; } 
.x-combo-list-item { white-space: pre-wrap !important; word-wrap: break-word !important;}