Как автоматически установить высоту и ширину строки в панели ext.js?

Question

У меня есть расширенный java скрипт Panel со мной, который содержит несколько столбцов. Данные внутри столбца принимаются с сервера. Несколько раз данные с сервера для каждого столбца большие и не помещаются внутри строки.

Вот код для того же:

Ext.define('DataDetailsGrid', { 
    extend: 'Ext.grid.Panel', 
    requires: [ 
     'DataStore' 
    ], 
    id: 'DataDetailsGrid', 
    xtype: 'grid', 
    margin: "20 20 20 20", 
    nestedView: false, 
    title: 'Student information', 
    store: 'DataStore', 
    frame: true, 
    flex: 1, 
    viewConfig : { 
     deferEmptyText: false, 
     emptyText: 'No data Available' 
    }, 
    columns: [ 
     { text: 'Id', flex: 0.5, dataIndex: 'id' }, 
     { text: 'Student name', flex: 1, dataIndex: 'student_name' }, 
     { text: 'Time Stamp', flex: 1, dataIndex: 'requestTimeStamp' }, 
     { text: 'email Id', flex: 1, dataIndex: 'emailId' }, 
     { text: 'About Students', flex: 4, dataIndex: 'response' }, 
    ] 
}); 

вопрос с О Студенты, которые могут быть около 500 символов иногда. Это не устраивается внутри данной строки.

Answer 1

Вы можете использовать этот код css для переноса данных Adout Students.
Проверить скрипку: https://fiddle.sencha.com/#fiddle/1i3g

.x-grid-cell-inner { 
white-space: initial; 
} 

Answer 2

Все, что вам нужно сделать, это добавить следующую строку в ваш column «ы определение

cellWrap: true 

Проверьте эту скрипку: https://fiddle.sencha.com/#fiddle/1i5o . Я позволил разворачивать скрипку Аджай Тхакура.

Таким образом, в вашем случае, изменить свой вредоносный код, в следующей строке:

{ text: 'About Students', flex: 4, dataIndex: 'response', cellWrap: true }