PDA

View Full Version : [CLOSED][3.1] TreePanel and Window Prevents DD



elnove
19 Jan 2010, 3:25 AM
Hi,
I have a grid and a tree panel and it enable user to drag grid rows to the tree - that works fine.

On every node (a row from the grid) that is dropped and added to the tree, I need to open a window with the dropped node details.

The problem is as follows:
1. When the first node is dropped, the details window is open.
2. windows is closed.
3. When dropping new (2nd) row on the tree I get this error me.dom.is undefined

My guess is that something with the closed window is messing up the tree's D&D behavior, but couldn't find a solution to that.

The following is my code, I'm opening the window on the tree's 'append' event (mark in red).
All the drop is done on the 'noftifydrop' event.
BTW: sometimes I get 'this.lastOverNode is undefined' error. I'm using last node, in the onNodeOver event in order to use it in the notifydrop event as the node to append the new child to.



vfr.widgets.MealFoodsTree = function (config) {
Ext.apply(this, config);

this.foodWindow = new Ext.Window({
layout: 'fit',
width: 500,
height: 300,
plain: true,
title: 'ffff',
buttons: [{
text: 'ok',
handler: function () {
this.foodWindow.close();

},
scope:this

} ]
});

vfr.widgets.MealFoodsTree.superclass.constructor.call(this, {
frame: true,
useArrows: false,
//loader: new Ext.tree.TreeLoader({ preloadChildren: true }),
autoScroll: true,
animate: true,
//enableDD: true,
enableDrop: true,
dropConfig: {
ddGroup: 'mealFoodsDDGroup',
dropAllowed: true,
notifyDrop: function (source, e, data) {
var select = data.selections;

this.cancelExpand();
this.removeDropIndicators(this.lastOverNode);
var node = this.lastOverNode.node;

if (node.id == 'meal-root' || node.id.toString().indexOf('food') >= 0) {
e.cancel = true;
return false;
}

//get droped food data
var foodId = select[0].data.ID;
var foodName = select[0].data.Name;

var mealFoodNode = new Ext.tree.TreeNode({
text: foodName,
draggable: false,
allowDrop: false,
leaf: true,
id: 'food-' + foodId,
expanded: true
});

mealFoodNode.attributes.nodeType = 'foodNode';
mealFoodNode.attributes.foodId = foodId;
mealFoodNode.attributes.foodName = foodName;

node.appendChild(mealFoodNode);
return true;

},
onNodeOver: function (n, dd, e, data) {
// slightly modified from TreeDropZone
// this just highlights the node currently hovering over.
// without regard to leaf or not. See original TreeDropZone
// version to change to leaf only.
var pt = this.getDropPoint(e, n, dd);
var node = n.node;

// auto node expand check
if (!this.expandProcId && pt == "append" && node.hasChildNodes() && !n.node.isExpanded()) {
this.queueExpand(node);
} else if (pt != "append") {
this.cancelExpand();
}

// set the insert point style on the target node
var returnCls = this.dropNotAllowed;
if (this.isValidDropPoint(n, pt, dd, e, data)) {
if (pt) {
var el = n.ddel;
var cls;
if (node.attributes.nextType == 'none') {
returnCls = "x-tree-drop-ok-append";
cls = "x-tree-drag-append";
if (this.lastInsertClass != cls) {
Ext.fly(el).replaceClass(this.lastInsertClass, cls);
this.lastInsertClass = cls;
}
}
}
}
return returnCls;
}
},
containerScroll: true,
border: false,
root: {
id: 'meal-root',
text: vfr.local.rootNode,
expanded: true,
allowDrop: false,
children: [{
text: vfr.local.servingNodeText + '1',
id: 's1',
leaf: false,
expanded: true,
children: [{
text: 'dummy',
id: 'h1',
leaf: false,
expanded: false,
hidden: true
} ]
}, {
text: vfr.local.servingNodeText + '2',
id: 's2',
leaf: false,
expanded: true,
children: [{
text: 'dummy',
id: 'h2',
leaf: false,
expanded: false,
hidden: true
} ]
}, {
text: vfr.local.servingNodeText + '3',
id: 's3',
leaf: false,
expanded: true,
children: [{
text: 'dummy',
id: 'h3',
leaf: false,
expanded: false,
hidden: true
} ]
}, {
text: vfr.local.servingNodeText + '4',
id: 's4',
leaf: false,
expanded: true,
children: [{
text: 'dummy',
id: 'h4',
leaf: false,
expanded: false,
hidden: true
} ]
}, {
text: vfr.local.servingNodeText + '5',
id: 's5',
leaf: false,
expanded: true,
children: [{
text: 'dummy',
id: 'h5',
leaf: false,
expanded: false,
hidden: true
} ]
} ]
},
bodyStyle: {
background: '#ffffff'
}
});


this.on({
append: function (T, parent, node, index) {
if (node.attributes.nodeType == 'foodNode') {
this.foodWindow.show();
this.fireEvent('foodadd', node);
}
},
scope: this
});
};//end class


Ext.extend(vfr.widgets.MealFoodsTree, Ext.tree.TreePanel, {
initComponent: function () {
vfr.widgets.MealFoodsTree.superclass.initComponent.call(this);
this.addEvents('foodadd');
}
});



Is this a BUG ?

evant
19 Jan 2010, 3:35 AM
Not a bug. Close destroys the window, which removes it from the dom.

Check out the closeAction property on the Windoiw, if you just want to hide it.

Marking as closed.

elnove
21 Jan 2010, 5:52 AM
Thank you, that worked :)
EL