PDA

View Full Version : CellEditing plugin doesn't work if i have more than one grids



eternasparta
20 May 2013, 2:11 AM
Hi all,
I have a simple page with 2 or more grids and I want to use CellEditing plugin to edit cells of those grids.
If I have only a grid all works well, but if I make 2 grids (or more) CellEditing plugin stop to work.
Anyone know how to solve this problem?

I have made a little minimized example that is affected with this problem.

In this example you can try to add a row to the first grid and double click to edit that grid. As you can see cell editing doesn't work at all.
If you add and edit the cell in the second grid, it work.

http://jsfiddle.net/eternasparta/amHRr/

evant
20 May 2013, 2:34 AM
Change your code so that you assign the items inside initComponent:



Ext.require(['Ext.form.*', 'Ext.tip.*']);

var store = Ext.create('Ext.data.Store', {
fields: ['label'],
data: []
});
Ext.define('AM.view.editpanel.CustomList', {
extend: 'Ext.container.Container',
alias: 'widget.sclist',
layout: {
type: 'vbox',
align: 'stretch'

},
flex: 1,
initComponent: function() {
this.items = [{
xtype: 'grid',
plugins: [xt.create('Ext.grid.plugin.CellEditing', {
clicksToEdit: 2
})],
selModel: {
selType: 'cellmodel'
},
tbar: [{
text: 'Add',
actionId: 'add',
handler: function(th, e, eArg) {
var store = th.up('grid').store;
var r = Ext.create(store.model.modelName);
store.insert(0, r);

}
}],
height: 200,
store: store,
columns: [{
text: 'Name',
dataIndex: 'label',
flex: 1,
editor: {
xtype: 'numberfield',
allowBlank: false
}
}, {
xtype: 'actioncolumn',
width: 30,
sortable: false,

actionId: 'delete',
header: 'delete',
items: [{
tooltip: 'tool'

}]
}],
flex: 1
}];

this.callParent(arguments);

var sto = Ext.create('Ext.data.Store', {
fields: ['label'],
data: []
});
this.down('grid').bindStore(sto);
this.down('grid').columns[0].text = 'Name';
this.down('grid').columns[0].dataIndex = 'label';
}
});

Ext.onReady(function() {

Ext.QuickTips.init();

var grid1 = Ext.create('AM.view.editpanel.CustomList', {
renderTo: Ext.getBody()
});
var grid2 = Ext.create('AM.view.editpanel.CustomList', {
renderTo: Ext.getBody()
});
});


The problem is that you're declaring the plugins array on the prototype, which means it will be shared across instances.

eternasparta
20 May 2013, 4:22 AM
Thank you evant for your answer.

Simply perfect!