PDA

View Full Version : MVC: enable a disabled actioncolumn item



nixerella
17 Feb 2012, 5:10 AM
I have a view which is a gridpanel with three columns, two columns that hold data from the store and the last column is an action column with two items in it (in this order): delete and view. By default I've set the delete one to be disabled by doing "disabled:true" in the config for the delete item. That's fine but some users are permitted to delete so under those circumstances I need to enable that first item in the action column but I won't know when initComponent runs so I have to do it later.

In the view I've defined a function called enableDelete (that I call from the controller, and I call the controller from the app once I know the user is permitted) and in that I have tried 2 things:


Ext.getCmp('myActionCol').enableAction(0); (the id of my actioncolumn is 'myActionCol')
and

this.columns[2].enableAction(0);

but both result in an error in enableAction - on the

me.up('tablepanel').el.select... line tablepanel is an object but el is undefined.

Can anyone advise how I should be doing it - I can't find any examples and am just guessing? I realise it's hard without the view code so I will try and enter that in (I can't paste it unfortunately) shortly.

mitchellsimoens
17 Feb 2012, 5:16 AM
I did


var col = grid.down('actioncolumn');

col.enableAction(0);

I got no errors in 4.0.7 and 4.1.0 beta2

nixerella
17 Feb 2012, 6:01 AM
Thanks. I've changed my code to do

var col=this.down('actioncolumn');
col.enableAction(0);

but am still getting the same error. In the debugger I can see that col is of type actioncolumn so it looks as if I am now selecting the action column correctly. I'm using ext 4.0.6.

nixerella
19 Feb 2012, 7:54 AM
Still cannot get it working, I think it is something to do with rendering. Here's code from an example I knocked up today which also has the same problem:

controller function to enable the first action column:


enableDel: function () {
var view = Ext.widget('personlist');
view.down('actioncolumn').enableAction(0);
}

the view:

Ext.define('PP.view.person.List', {
extend: 'Ext.grid.Panel',
alias: 'widget.personlist',
title: 'Current people',
store: 'People',
columnLines: true,

initComponent: function () {
this.columns = [
{ header: 'Id', dataIndex: 'personId', flex: 1, sortable: true },
{ header: 'Title', dataIndex: 'title', flex: 1 },
{ header: 'Name', dataIndex: 'name', flex: 1},
{ xtype:'actioncolumn',
items:[
{icon:'cross.gif',disabled:true,handler:function(){alert('delete pressed');}},
{icon:'tick.gif',handler:function(){alert('view pressed');}}
]
}
];

this.callParent(arguments);
}
});


If I specify
renderTo: Ext.getBody(); in my view I don't get the error, but the column doesn't enable either, which is why I think it might be a rendering problem. As far as I can see the source code for enableAction in 4.0.6 is the same as 4.0.7 so I don't think it is that.

The grid is in a viewport so here is the code in app.js in case I've done that wrong:
Ext.require(['Ext.container.Viewport', 'Ext.grid.Panel']);
Ext.application({
name: 'PP',
appFolder: 'app',
controllers: 'People',
launch: function () {
Ext.create('Ext.container.Viewport', {
layout: 'anchor',
items: [
{
xtype: 'panel',
width: '100%',
height: 80,
bodyStyle: 'padding-left:10px;padding-top:20px;padding-bottom:20px;',
items: [
{ xtype: 'button', width: 50, height: 20, text: 'Create', action: 'showCreate' },
{ xtype: 'button', width: 50, height: 20, text: 'Test', action: 'enableDel }
]
},
{
xtype: 'personlist',
anchor: '-5, -100'
}
]
});
}
});

nixerella
20 Feb 2012, 2:34 AM
Ok seems I misunderstood. If I call the enableDel in the afterender of either the actioncolumn or the grid it's fine. I was calling it much later (from a button click). It turns out that I will know whether to enable much earlier that I thought so I can simply pass
adminMode:true (or false) into the configs of the list and then in the actioncolumn definition do
disabled: !this.adminMode I'd still be interested to know how you enable an actioncolumn item much later on.

mitchellsimoens
20 Feb 2012, 5:00 AM
You use the enableAction method on the action column

nixerella
20 Feb 2012, 10:01 AM
Yes, but when I tried that I was getting the aforementioned error in enableAction because the tablepanel's el was undefined. Any chance you could post a simple example that works please? It either doesn't work in ext 4.0.6 or I'm doing something wrong.