PDA

View Full Version : How to disable entire column with CellEditing Plugin



Ankit.Desai
20 Dec 2011, 1:02 PM
Hi,

I am having editable grid with 4 columns as editable and other 3 non editable. I want to make those all 4 column un-editable on certain condition, let's say when user has only view access.

Below is the code I am having


var cellPressureEditing = Ext.create('Ext.grid.plugin.CellEditing', {
clicksToEdit: 1
});

var pressureCols = [
{id:'Month',header: "Month", width: 50, sortable: true, dataIndex: 'month',
field: {
xtype: 'combobox',
typeAhead: true,
triggerAction: 'all',
selectOnTab: true,
store: [
['JAN','JAN'],
['FEB','FEB'],
['MAR','MAR'],
['APR','APR'],
['MAY','MAY'],
['JUN','JUN'],
['JUL','JUL'],
['AUG','AUG'],
['SEP','SEP'],
['OCT','OCT'],
['NOV','NOV'],
['DEC','DEC']
],
lazyRender: true,
listClass: 'x-combo-list-small'
}
},
.............
]
var pressureGridNew = new Ext.grid.GridPanel({
id : "pressure-grid",
ddGroup : 'gridDDGroup',
store : pressureGridStoreNew,
columns : pressureCols,
enableDragDrop : true,
stripeRows : true,
autoExpandColumn : 'name',
width : 610,
height : 400,
plugins :[cellPressureEditing]
});

Ext.getCmp('pressureGridPanel').add('pressure-grid');
if(siteAccess=='View'){
//var headCount = pressureGridNew.headerCt.gridDataColumns.headerCounter;

var plug = pressureGridNew.getPlugin();
plug.clicksToEdit = 0;
plug.cancelEdit();
}





In Firebug I can see that clicksToEdit is set to 0 in pressureGridNew and plug objects, but still I am getting dropdown which is edit field in those 4 columns in each cells.

Hope to hear from you guys.

-Ankit

mitchellsimoens
20 Dec 2011, 1:47 PM
The plugin has a beforeedit event that you can hook in to.

Ankit.Desai
21 Dec 2011, 6:54 AM
Thanks mitchellsimoens. It works.

I found that solution in Grid FAQ (http://www.sencha.com/learn/grid-faq/#Store_appears_empty_even_after_calling_load.28.29) but did not try it, may be because of Giants defeat against Skins. :s

Below is the code part where I have implemented it for others reference.


var cellPressureEditing = Ext.create('Ext.grid.plugin.CellEditing', {
clicksToEdit: 1,
listeners : {
beforeedit : function(e) {
if(siteAccess=='View'){
if(e.colIdx == 0 || e.colIdx == 1 || e.colIdx == 2){ // columns Which are not editable in first place
return true;
}else{ // Other columns Which are editable which are wanted to be non-editable.
return false;
}
}
}
}
});

Thanks again.

-Ankit