PDA

View Full Version : RowEditor Plugin Error - g is undefined



MarcoMalar
6 Dec 2010, 1:22 AM
Hi,

following lines of code:


var editor = Ext.getCmp('gridEditor');
var grid = Ext.getCmp('grid');
...
editor.stopEditing();
grid.store.insert(0, contact);
grid.getView().refresh();
grid.getSelectionModel().selectRow(0);
editor.startEditing(0);
when executing the
editor.startEditing(0) an error occurs on line 150 of the RowEditor.js file. The error text is "g is undefinded".
The grid seems not to be instantiated correctly because line 150 is:


var g = this.grid, view = g.getView(),
I'm using the following code to attach the editor to the grid:


var editor = new Ext.ux.grid.RowEditor({
ref: '../gridEditor',
id: 'gridEditor',
saveText: 'Update'
});
...


Ext.apply(grid, {
plugins: [editor],
view: new Ext.grid.GroupingView({
markDirty: false
}),
store : store
});

Condor
6 Dec 2010, 1:38 AM
You can't 'apply' config options to an existing grid. They need to be present when the grid is created.

MarcoMalar
6 Dec 2010, 3:09 AM
Thanks for the quick answer!
I'm using the Ext Designer to create components. What would be the best way to integrate the RowEditor Plugin?
Is there a possibility to configure it directly in the Ext Designer Tool?
When i try to apply the whole grid to the component items, this does not work either.


Ext.apply(gridContainingComponent, {
items: grid
});
This leads to an "items is undefined" error.

Condor
6 Dec 2010, 3:11 AM
You'll have to set these options in the initComponent method of the grid class.

MarcoMalar
6 Dec 2010, 7:14 AM
I am now implementing the whole grid without using the Ext Designer Tool. Now it works until I click on the update button after editing an inserted row. The parameters of the afteredit function are not filled. The alert does not contain any message.


editor.on('afteredit', function(rowEditor, changes, record, rowIndex){
Ext.Msg.alert(rowIndex);
});

Condor
6 Dec 2010, 10:47 AM
That is strange... Could you post all the grid code you are using now?

MarcoMalar
6 Dec 2010, 11:56 PM
I forgot to mention that I set hasChange = true (line 199) of RowEditor.js because first no 'afterEdit' event had been thrown. (see http://www.sencha.com/forum/showthread.php?106304-OPEN-1181-Row-Editor-afteredit-doesn-t-always-fire-when-existing-row-is-edited&highlight=roweditor+afteredit)
After this change the event was thrown but with empty parameters.
I cancelled the use of the RowEditor plugin yesterday and am now using the Editorpanel delivered within the Ext Designer Tool.

Nevertheless thanks for the help and here the code that i had before:


var contacts = Ext.getCmp('Contacts');

var editor = new Ext.ux.grid.RowEditor({
saveText: 'Update'
});

var Contact = Ext.data.Record.create([{
name: 'contactFunction',
type: 'string'
}, {
name: 'contactName',
type: 'string'
}, {
name: 'contactDepartment',
type: 'string'
}, {
name: 'contactId',
type: 'string'
}]);

var store = new Ext.data.GroupingStore({
reader: new Ext.data.JsonReader({
fields: Contact
}),
url: '...URL...',
sortInfo: {
field: 'name',
direction: 'ASC'
}
});

var grid = new Ext.grid.GridPanel({
xtype: 'grid',
ref: '../../../grid',
id: 'grid',
plugins: [editor],
view: new Ext.grid.GroupingView({
markDirty: false
}),
store: store,
columns: [{
xtype: 'gridcolumn',
header: 'Funktion',
sortable: true,
width: 100,
editor: {
xtype: 'textfield'
}
}, {
xtype: 'gridcolumn',
header: 'Name',
sortable: true,
width: 100,
editor: {
xtype: 'textfield',
allowBlank: false
}
}, {
xtype: 'gridcolumn',
header: 'Abteilung',
sortable: true,
width: 100,
editor: {
xtype: 'textfield'
}
}],
tbar: {
xtype: 'toolbar',
items: [{
xtype: 'button',
text: 'Hinzufügen',
ref: '../../../../../AddContactButton',
id: 'AddContactButton',
handler: function(){
var e = new Contact({
contactFunction: '',
contactName: '',
contactDepartement: ''
});
editor.stopEditing();
store.insert(0, e);
grid.getView().refresh();
grid.getSelectionModel().selectRow(0);
editor.startEditing(0);
}
}, {
xtype: 'button',
text: 'Entfernen',
ref: '../../../../../RemoveContactButton',
id: 'RemoveContactButton',
disabled: true,
handler: function(){
editor.stopEditing();
var s = grid.getSelectionModel().getSelections();
for (var i = 0, r; r = s[i]; i++) {
store.remove(r);
}
}

}]
}
})

contacts.add(grid);

Condor
7 Dec 2010, 12:08 AM
Even after setting hasChange:true, the event should still fire with the correct parameters. Are you sure you applied this patch correctly?