PDA

View Full Version : I Can't render tems Action Column



jacksparoow1
7 Oct 2012, 9:29 AM
Hi

Please can you tell me what's wrong in this code :

I'm trying to extend Action Column with two Items.

Try please to replace the code in code editor in this documentation url (http://docs.sencha.com/ext-js/4-1/#!/api/Ext.grid.column.Action) to see the problem :


Ext.create('Ext.data.Store', {
storeId:'employeeStore',
fields:['firstname', 'lastname', 'seniority', 'dep', 'hired'],
data:[
{firstname:"Michael", lastname:"Scott"},
{firstname:"Dwight", lastname:"Schrute"},
{firstname:"Jim", lastname:"Halpert"},
{firstname:"Kevin", lastname:"Malone"},
{firstname:"Angela", lastname:"Martin"}
]
});


Ext.define('Ext.grid.column.Custom', {
extend: 'Ext.grid.column.Action',
alias: ['widget.customcolumn'],
width: 50,
items: [{
xtype : 'button',
icon: 'extjs/examples/shared/icons/fam/cog_edit.png', // Use a URL in the icon config
tooltip: 'Edit',
handler: function (grid, rowIndex, colIndex) {
var rec = grid.getStore().getAt(rowIndex);
alert("Edit " + rec.get('firstname'));
}
}, {
xtype : 'button',
icon: 'extjs/examples/restful/images/delete.png',
tooltip: 'Delete',
handler: function (grid, rowIndex, colIndex) {
var rec = grid.getStore().getAt(rowIndex);
alert("Terminate " + rec.get('firstname'));
}
}]
});


Ext.create('Ext.grid.Panel', {
title: 'Action Column Demo',
store: Ext.data.StoreManager.lookup('employeeStore'),
columns: [
{text: 'First Name', dataIndex:'firstname'},
{text: 'Last Name', dataIndex:'lastname'},
{
xtype:'customcolumn',
}
],
width: 250,
renderTo: Ext.getBody()
});

skirtle
7 Oct 2012, 3:35 PM
Take a look at the constructor for Action column:

http://docs.sencha.com/ext-js/4-1/source/Action.html#Ext-grid-column-Action-method-constructor

It seems that it doesn't read the items from this, it just checks the config, so adding them to the prototype via Ext.define won't work. I can't think of a good reason why it does this, it should probably be changed.

You're going to have to override the constructor and pass a suitable config to the original constructor to get it to work.

slemmon
23 Oct 2012, 12:34 PM
I just found the same thing. BTW, width is also not read, but text is.

Should we file this as a bug or as an enhancement request to have width, items, etc. read from 'this' in the definition?

predator
16 Nov 2012, 3:33 PM
Same drama here.. does anybody solve it?

mchugh
28 Oct 2014, 6:09 AM
I know this is ancient but I recently ran across the same problem and thought I would clarify for any others that might discover it.

I fixed it by overriding the constructor and applying the properties of the rest of the class to the config passed into the parent constructor.

Like so:


Ext.define('PulseDesktop.view.investors.column.OrdersAction', {
extend : 'Ext.grid.column.Action',
constructor: function(config) {
Ext.apply(config, this);
this.callParent([config]);
},
items: [...],
...
});

You could obviously tailor this to your needs, so if you only needed to add the items then you could simply do:



Ext.define('PulseDesktop.view.investors.column.OrdersAction', {
extend : 'Ext.grid.column.Action',
constructor: function(config) {
config.items = this.items;
this.callParent([config]);
},
items: [...],
...
});