PDA

View Full Version : Cellediting set value on cell textfield after submit



fily55
19 Jul 2012, 6:51 AM
Hi guys,

I have a grid with the cell plugin. I have cell editor which is a textfield which runs a function on blur. Depending on the result the value of the textfield can change. This works fine for blur. Another words if I'm in the textfield and click outside of the field it runs perfectly. The problem is when I press tab or enter it will run some edit event first before the blur. Thus the value doesn't get changed.

Any Ideas?

PS:
I've tried to use validateedit: but I can't get the field which I am editing. I need to send this field to a different function just like I am doing in blur.

scottmartin
19 Jul 2012, 7:47 AM
Please have a look at the following example:

Edit 1st record and last record will be updated on enter




Ext.onReady(function() {

var store = Ext.create('Ext.data.Store', {
storeId:'simpsonsStore',
fields:['name', 'email', 'change'],
data:{'items':[
{ 'name': 'Lisa', "email":"lisa@simpsons.com", "change":100 },
{ 'name': 'Bart', "email":"bart@simpsons.com", "change":-20 },
{ 'name': 'Homer', "email":"home@simpsons.com", "change":23 },
{ 'name': 'Marge', "email":"marge@simpsons.com", "change":-11 }
]},
proxy: {
type: 'memory',
reader: {
type: 'json',
root: 'items'
}
}
});

var cellEditing = Ext.create('Ext.grid.plugin.CellEditing', {
clicksToEdit: 1,
listeners: {
edit: function(editor, e, opts){
console.log('edit');
store.getAt(3).set({'name' : e.value});
},
beforeedit: function(editor, e, opts){
console.log('beforeedit');
}
}

});

var grid = Ext.create('Ext.grid.Panel', {
title: 'Simpsons',
store: Ext.data.StoreManager.lookup('simpsonsStore'),
columns: [
{ header: 'Name', dataIndex: 'name', editor: { xtype: 'textfield' } },
{ header: 'Email', dataIndex: 'email', flex: 1 },
{ header: 'Change', dataIndex: 'change', editor: { xtype: 'numberfield' } }
],
height: 200,
width: 400,
plugins: [cellEditing],
renderTo: Ext.getBody()
});

});