PDA

View Full Version : Move a node from one tree to other tree



Rajeshduraisamy
20 Dec 2009, 10:11 PM
Hi,

I am new to Ext js.I am having two trees namely tree1 and tree2. I want to move a node from one teee1 to tree2 and vice versa.pls send me a sampe code to trigger a serverside event during the drag and drop and send a code sample to trger an "insert" event in tree.

Regards,
Rajesh

tot2ivn
20 Dec 2009, 11:04 PM
Here you go,

http://www.extjs.com/deploy/dev/examples/tree/two-trees.html

Cheers,

Totti

Rajeshduraisamy
21 Dec 2009, 12:51 AM
Hi Totti,

Thanks For Ur Reply.I want to Update some changes in the server side so can u pls send the code for the insert event in tree 2 and the parameters,with examples. thanks in advance

Regards,
Rajesh.D

tot2ivn
21 Dec 2009, 2:57 AM
Rajesh,

Following the example link above. In this js file:
http://www.extjs.com/deploy/dev/examples/tree/two-trees.js

In order to update modification when inserting a node to tree2, you need to make use of the event: beforenodedrop : ( Object dropEvent ) (http://www.extjs.com/deploy/dev/docs/source/TreePanel.html#event-Ext.tree.TreePanel-beforenodedrop)
to send requests (http://www.extjs.com/deploy/dev/docs/source/Connection.html#method-Ext.data.Connection-request) to server using of the Ajax utility of ExtJS. Depending on the server response: success / failure.. return true/false.

The tree2 var could look something like this:



var tree2 = new Tree.TreePanel({
animate:true,
autoScroll:true,
//rootVisible: false,
loader: new Ext.tree.TreeLoader({
dataUrl:'get-nodes.php',
baseParams: {path:'extjs'} // custom http params
}),
containerScroll: true,
border: false,
width: 250,
height: 300,
enableDD:true,
dropConfig: {appendOnly:true},

listeners: {
beforenodedrop: function(dropEvent) {
/*
The dropEvent passed to handlers has the following properties:
tree - The TreePanel
target - The node being targeted for the drop
data - The drag data from the drag source
point - The point of the drop - append, above or below
source - The drag source
rawEvent - Raw mouse event
dropNode - Drop node(s) provided by the source OR you can supply node(s) to be inserted by setting them on this object.
cancel - Set this to true to cancel the drop.
dropStatus - If the default drop action is cancelled but the drop is valid, setting this to true will prevent the animated 'repair' from appearing.
*/

//.. form request params

// Make Ajax request
Ext.Ajax.request({
url: 'insert-node-to-tree-2.php',
success: someFn,
failure: otherFn,
headers: {
'my-header': 'foo'
},
params: { foo: 'bar' }
});
}
}
});

Good luck,

Totti

Rajeshduraisamy
21 Dec 2009, 3:54 AM
Hi Totti,

Thanks for your Help It Works. :)
I am having another Doubt.How to make a tree to accept only the nodes from other tree while drag and drop.I should be able to drag and drop any node to/from an external tree but drag and drop should not work for the same tree.Can u pls send code samples.Thanks for ur Help in advance.

Regards,
Rajesh

tot2ivn
21 Dec 2009, 5:43 AM
Hi Rajesh,

Well, still this event beforenodedrop : ( Object dropEvent ) (http://www.extjs.com/forum/../deploy/dev/docs/source/TreePanel.html#event-Ext.tree.TreePanel-beforenodedrop) should be able to give you enough info to decide whether to accept / reject a node drop:


beforenodedrop: function(dropEvent) {
/*
The dropEvent passed to handlers has the following properties:
tree - The TreePanel
target - The node being targeted for the drop
data - The drag data from the drag source
point - The point of the drop - append, above or below
source - The drag source
rawEvent - Raw mouse event
dropNode - Drop node(s) provided by the source OR you can supply node(s) to be inserted by setting them on this object.
cancel - Set this to true to cancel the drop.
dropStatus - If the default drop action is cancelled but the drop is valid, setting this to true will prevent the animated 'repair' from appearing.
*/
}

--> You can figure out the treePanel this node comes from --> if the same tree then return false. If different tree, then continue making Ajax request.. :)

mystix
21 Dec 2009, 7:23 AM
@Rajeshduraisamy: please stop creating duplicate threads in every single forum.
all of your duplicate threads have been deleted.