PDA

View Full Version : reordering in TreePanel inside own level



Hacker-CB
10 Aug 2009, 2:15 AM
If I specify:

enableDD: true DD works with any objects inside treepanel.
I need that it will works only inside own level. How I can do it?

11 Aug 2009, 4:38 AM
Hacker?

One way to do this is to setup a 'isValidDropPoint' override for the dropConfig object.




isValidDropPoint : function(nodeData, pt, dd, e, data){
if(!nodeData || !data){ return false; }
var targetNode = nodeData.node;
var dropNode = data.node;

var dropNodeParent = dropNode.parentNode;
if (dropNodeParent.contains(targetNode)) {
return Ext.tree.TreeDropZone.prototype.isValidDropPoint.call( this.dropZone, nodeData, pt, dd, e, data);
}

return false;
}

This method runs within the context of the instance of Ext.tree.TreePanel itself.


I'm going to see if i can squeeze this into Chapter 11 of Ext JS in Action (http://garcia.com/manning).

Hacker-CB
11 Aug 2009, 6:54 AM
this does not work, may be something wrong?

dropConfig: new Ext.tree.TreeDropZone ({
isValidDropPoint : function(nodeData, pt, dd, e, data){
if(!nodeData || !data){ return false; }
var targetNode = nodeData.node;
var dropNode = data.node;

var dropNodeParent = dropNode.parentNode;
if (dropNodeParent.contains(targetNode)) {
return Ext.tree.TreeDropZone.prototype.isValidDropPoint.call( this.dropZone, nodeData, pt, dd, e, data);
}

return false;
}
This works, but the "forbidding cursor" is not displayed:

listeners: {
beforenodedrop: function (dropEvent){
var targetNode = dropEvent.target;
var dropNode = dropEvent.data.node;
var dropNodeParent = dropNode.parentNode;

if (dropNodeParent.contains(targetNode)) {
return true;
}
return false;
}
}

11 Aug 2009, 7:40 AM
What?!?!

var isValidDropPoint = function() { ... }
dropConfig : { isValidDropPoint : isValidDropPoint.createDelegate(this) }

Hacker-CB
11 Aug 2009, 7:53 AM
This does not work.

When I start to drag this error appears in firebug:


overEvent is undefined
chrome://firebug/content/blank.gif overEvent.tree = this.tree;
ext-all-debug.js (line 48094)

11 Aug 2009, 8:36 AM
My implementation works perfectly. How about posting a publically available demo?

Hacker-CB
12 Aug 2009, 3:00 AM
My implementation works perfectly. How about posting a publically available demo?

Please, look:
http://demo.sokolov.me/tree1.html

12 Aug 2009, 3:28 AM
What version of Ext are you using? 3.0? try the latest 3.0 stable.


var isValidDropPoint=function(nodeData, pt, dd, e, data){
if(!nodeData || !data){ return false; }
var targetNode = nodeData.node;
var dropNode = data.node;
var tree = targetNode.getOwnerTree();

var dropNodeParent = dropNode.parentNode;
if (dropNodeParent.contains(targetNode)) {
return Ext.tree.TreeDropZone.prototype.isValidDropPoint.call( tree.dropZone, nodeData, pt, dd, e, data);
}
return false;
};


var tree = new Ext.tree.TreePanel({
//useArrows: true,
autoScroll: true,
animate: true,
enableDD: true,
containerScroll: true,
border: false,
// auto create TreeLoader
//dataUrl: 'ext/examples/tree/get-nodes.php',
dataUrl : 'get-nodes.php',
root: {
nodeType: 'async',
text: 'Ext JS',
draggable: false,
id: 'src'
},
dropConfig: {
isValidDropPoint : isValidDropPoint
},
renderTo : Ext.getBody()
});

// render the tree
tree.render('tree-div');
tree.getRootNode().expand();

Hacker-CB
12 Aug 2009, 3:34 AM
I'm using latest available version: 3.0.0