ExtJS: Làm thế nào để bọc văn bản trong một ListView với các cột?

Question

Tôi có một điều khiển ExtJSListView với 4 cột. Một trong các cột chứa văn bản mở rộng chiều rộng của cột, do đó một số văn bản được đặt bên dưới cột tiếp theo.

Làm thế nào tôi có thể thiết lập white-space-normal cho các tế bào trong listview?

Answer 1

này phải ở trong định nghĩa cột của bạn:

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

Answer 2

Sdavids solution công trình, Tôi đã bỏ phiếu cho điều đó.

Nhưng chỉ trong trường hợp bạn thích sử dụng một lớp css thay vì phong cách đây là cách:

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

Sau đó, bạn cần dòng này trong một số tập tin css:

.listViewColumnWrap { white-space:normal; } 

Answer 3

này là một cách trình duyệt chéo để ghi đè các lớp css mặc định để làm cho tất cả các chế độ xem danh sách, lưới và combobox của bạn chọn tất cả các nội dung văn bản của chúng:

.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;}