In one app, some messages were displayed into a grid, quite a common stuff.
However, long messages were stripped and I needed to display the whole message.
Here is the approach:
1) Add the following style to your css/scss
.multiline-row { overflow: auto !important; white-space: normal !important; text-overflow: ellipsis; display: block; }
2) Define a rendered for the multiline cell. For example, here is my column declaration ( I prefer to use a span instead of a div )
, columns: [
{
xtype: 'gridcolumn', align: 'left'
, dataIndex: 'message_content', flex: 3, text: 'Msg'
, renderer: function (value, metaData, record, rowIndex) {
return '' + value + '';
}
]
And that’s pretty all!