PDA

View Full Version : [FIXED] grid RowExpander without enableLocking : colspan problem



pbaccari
5 Apr 2013, 1:04 AM
Hi,

I have a problem when I want to use the plugin RowExpander in a grid without enableLocking.

When I configure enableLocking to false, the colspan of the RowExpander decrease automatically on each row (see attachment).
Iíve realized an example with ExtJs examples.
The only different with the official code is:


enableLocking: false,


Iíve seen in the plugin there is a condition in getRowBodyFeatureData function, if I remove this condition, the plugin works fine :



// If we are lockable, the expander column is moved into the locked side, so we don't have to span it
if (!me.grid.ownerLockable) {
rowValues.rowBodyColspan = rowValues.rowBodyColspan - 1;
}


But, I donít understand why the plugin RowExpander needs enableLocking to work.
Thanks


Some information:
Ext version :

4.2.0.663


Browser :

Chrome : Version 26.0.1410.43 m
Firefox : Version 20



Test Case :



Ext.Loader.setConfig({
enabled: true
});

Ext.require([
'Ext.grid.*',
'Ext.data.*',
'Ext.selection.CheckboxModel'
]);

Ext.onReady(function () {
Ext.define('Company', {
extend: 'Ext.data.Model',
fields: [{
name: 'company'
}, {
name: 'price',
type: 'float'
}, {
name: 'change',
type: 'float'
}, {
name: 'pctChange',
type: 'float'
}, {
name: 'lastChange',
type: 'date',
dateFormat: 'n/j h:ia'
}, {
name: 'industry'
}, {
name: 'desc'
}
]
});
// Array data for the grids
Ext.grid.dummyData = [
['3m Co', 71.72, 0.02, 0.03, '9/1 12:00am', 'Manufacturing'],
['Alcoa Inc', 29.01, 0.42, 1.47, '9/1 12:00am', 'Manufacturing'],
['Altria Group Inc', 83.81, 0.28, 0.34, '9/1 12:00am', 'Manufacturing'],
['American Express Company', 52.55, 0.01, 0.02, '9/1 12:00am', 'Finance'],
['American International Group, Inc.', 64.13, 0.31, 0.49, '9/1 12:00am', 'Services'],
['AT&T Inc.', 31.61, -0.48, -1.54, '9/1 12:00am', 'Services'],
['Boeing Co.', 75.43, 0.53, 0.71, '9/1 12:00am', 'Manufacturing'],
['Caterpillar Inc.', 67.27, 0.92, 1.39, '9/1 12:00am', 'Services'],
['Citigroup, Inc.', 49.37, 0.02, 0.04, '9/1 12:00am', 'Finance'],
['E.I. du Pont de Nemours and Company', 40.48, 0.51, 1.28, '9/1 12:00am', 'Manufacturing'],
['Exxon Mobil Corp', 68.1, -0.43, -0.64, '9/1 12:00am', 'Manufacturing']
];

// add in some dummy descriptions
for (var i = 0; i < Ext.grid.dummyData.length; i++) {
Ext.grid.dummyData[i].push('Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Sed metus nibh, sodales a, porta at, vulputate eget, dui. Pellentesque ut nisl. ');
}

Ext.QuickTips.init();

var getLocalStore = function () {
return Ext.create('Ext.data.ArrayStore', {
model: 'Company',
data: Ext.grid.dummyData
});
};

////////////////////////////////////////////////////////////////////////////////////////
// Grid 1
////////////////////////////////////////////////////////////////////////////////////////
// row expander

var grid1 = Ext.create('Ext.grid.Panel', {
store: getLocalStore(),
columns: [{
text: "Company",
flex: 1,
dataIndex: 'company'
}, {
text: "Price",
renderer: Ext.util.Format.usMoney,
dataIndex: 'price'
}, {
text: "Change",
dataIndex: 'change'
}, {
text: "% Change",
dataIndex: 'pctChange'
}, {
text: "Last Updated",
renderer: Ext.util.Format.dateRenderer('m/d/Y'),
dataIndex: 'lastChange'
}
],
enableLocking: false,
width: 600,
height: 800,
plugins: [{
ptype: 'rowexpander',
rowBodyTpl: new Ext.XTemplate(
'<p><b>Company:</b> {company}</p>',
'<p><b>Change:</b> {change:this.formatChange}</p><br>',
'<p><b>Summary:</b> {desc}</p>', {
formatChange: function (v) {
var color = v >= 0 ? 'green' : 'red';
return '<span style="color: ' + color + ';">' + Ext.util.Format.usMoney(v) + '</span>';
}
})
}
],
collapsible: true,
animCollapse: false,
title: 'Expander Rows in a Collapsible Grid with lockable columns',
iconCls: 'icon-grid',
margin: '0 0 20 0',
renderTo: Ext.getBody()
});

});

slemmon
5 Apr 2013, 5:57 AM
*Moved thread to Ext:Bugs
Thanks for the report! I have opened a bug in our bug tracker.

basitali
17 May 2013, 5:24 AM
Is there any way we can browse the fix and apply it to Ext 4.2.0 or download the 4.2.1 beta from somwhere? Thanks

hmnth1
24 Jun 2013, 11:36 PM
I am using extjs 4.2.1. When developing grid i want to hide the rowexpander icon . I dont want that icon in the grid. Simply i will show the expansion on double click