I have a grid that when is clicked change the property cellwrap from false to true
onCellClick: function(view, td, index, record, tr, rindex) {
var
me = this,
vm = me.getViewModel(),
field = me.lookupReference('descriptionField');
field.cellWrap = true;
field.getView().getStore().getSource().reload();
}
But i guess im making it wrong. Can i reload the grid with the cellwrap propertie change? Im using the v7.5.1.20
cellWrap
is a configuration of an Ext.grid.column.Column
. You can't simply change it after the grid is rendered, you need to use the reconfigure
method of Ext.grid.Panel to update the columns and set cellWrap
to true
.
You can try this code in a Sencha Fiddle (ExtJS 7.4.0 modern material), click anywhere and see how the top left cell is changing:
Ext.application({
name: 'Fiddle',
launch: function () {
const store = new Ext.data.Store({
fields: ['name', 'phone'],
data: [{
name: 'Name1 Name1 Name1 Name1 Name1 Name1 Name1 Name1 Name1 Name1 Name1 Name1',
phone: 111
}, {
name: 'Name2',
phone: 222
}, {
name: 'Name3',
phone: 333
}, {
name: 'Name4',
phone: 444
}, {
name: 'Name5',
phone: 555
}]
})
const myGrid = Ext.create({
renderTo: Ext.getBody(),
xtype: 'grid',
store: store,
selModel: 'cellmodel',
columns: [{
text: 'Name',
dataIndex: 'name',
cellWrap: false
}, {
text: 'Phone',
dataIndex: 'phone'
}],
listeners: {
cellclick: function (table, td, cellIndex, record, tr, rowIndex, e, eOpts) {
myGrid.reconfigure(null, [{
text: 'Name',
dataIndex: 'name',
cellWrap: true
}, {
text: 'Phone',
dataIndex: 'phone'
}]);
}
}
});
}
});