feddgis
10 Feb 2012, 6:03 AM
I use ext-4.0.7-gpl (in 4.1 beta 2 the tree doesn't load at all)
As we don't have RowEditing, I added an action column with the add button, to append child, see below.
The TreeStore is made with Designer, it seems okay and standard, I'll provide the code if it is needed. The only thing I did was changing the api,
Ext.apply(proxy.actionMethods, {
update: 'PUT',
create: 'POST',
destroy: 'DELETE'
});
I noticed that the store doesn't sync without explicit syncing; that the proxy uses 'update' operation when I was appending a new child; that the TreeStore cannon handle the server side id generation (in the method onUpdateRecords of Ext.data.TreeStore, in the line "original = me.tree.getNodeById(record.getId());").
What did I do wrong, or could it be a bug?
It also seemed to me that the code in appendChild method of NodeInterface ignores that the node was not expanded and loaded and pushes my new node into an empty childNodes array, so that on the screen I don't see siblings of my new node.
Is there any working example of how the tree editing process can be coded?
Thanks!
The code below has some commented attempts to try different ways, just for your fun.
{
icon: 'lib/ext4/resources/themes/images/default/dd/drop-add.gif',
tooltip: 'Add',
handler: function(grid, rowIndex, colIndex) {
var domainForm = Ext.create('PetroRes.view.DomainForm');
var wnd = Ext.create('Ext.Window', {
closable: true,
height:206,
width:400,
modal:true,
title: 'Edit Domain',
maximizable: false,
maximized: false,
layout: 'fit',
items: [
domainForm
],
fbar: [
{
xtype: 'button',
itemId: 'selectButton',
text: 'Save',
listeners: {
click: function(){
wnd.close();
var node = grid.store.getAt(rowIndex);
//node.expand();
var newDomain = domainForm.getValues();
newDomain.parent = {id: node.raw.id};
//console.log(newDomain);
//grid.store.add(newDomain);
var newNode = node.appendChild(newDomain);
console.log([node, newNode]);
me.store.sync();
node.expand();
}
}
},
{
xtype: 'button',
itemId: 'cancelButton',
text: 'Cancel',
listeners: {
click: function(){
wnd.close();
}
}
}
]
}).show();
}
As we don't have RowEditing, I added an action column with the add button, to append child, see below.
The TreeStore is made with Designer, it seems okay and standard, I'll provide the code if it is needed. The only thing I did was changing the api,
Ext.apply(proxy.actionMethods, {
update: 'PUT',
create: 'POST',
destroy: 'DELETE'
});
I noticed that the store doesn't sync without explicit syncing; that the proxy uses 'update' operation when I was appending a new child; that the TreeStore cannon handle the server side id generation (in the method onUpdateRecords of Ext.data.TreeStore, in the line "original = me.tree.getNodeById(record.getId());").
What did I do wrong, or could it be a bug?
It also seemed to me that the code in appendChild method of NodeInterface ignores that the node was not expanded and loaded and pushes my new node into an empty childNodes array, so that on the screen I don't see siblings of my new node.
Is there any working example of how the tree editing process can be coded?
Thanks!
The code below has some commented attempts to try different ways, just for your fun.
{
icon: 'lib/ext4/resources/themes/images/default/dd/drop-add.gif',
tooltip: 'Add',
handler: function(grid, rowIndex, colIndex) {
var domainForm = Ext.create('PetroRes.view.DomainForm');
var wnd = Ext.create('Ext.Window', {
closable: true,
height:206,
width:400,
modal:true,
title: 'Edit Domain',
maximizable: false,
maximized: false,
layout: 'fit',
items: [
domainForm
],
fbar: [
{
xtype: 'button',
itemId: 'selectButton',
text: 'Save',
listeners: {
click: function(){
wnd.close();
var node = grid.store.getAt(rowIndex);
//node.expand();
var newDomain = domainForm.getValues();
newDomain.parent = {id: node.raw.id};
//console.log(newDomain);
//grid.store.add(newDomain);
var newNode = node.appendChild(newDomain);
console.log([node, newNode]);
me.store.sync();
node.expand();
}
}
},
{
xtype: 'button',
itemId: 'cancelButton',
text: 'Cancel',
listeners: {
click: function(){
wnd.close();
}
}
}
]
}).show();
}