4 Replies Latest reply on Feb 14, 2008 10:00 AM by fabmars

    Rich:tree and drag and drop how-to

    fabmars

      I had to develop a drag'n'drop tree with folders and documents like you can find in Thunderbird for example.
      The builtin drag'n'drop feature of the rich:tree is truly excellent, and the developer's guide explains a lot.

      However I could never know how to make it to work properly, that is set the good events to know what's dragged and where it's dropped. It's written nowhere. At first I thought the tree would reorder the nodes by itself, but it wasn't the case. So I tried progrmatically. Curiously, setting a dragListener and a dropListener is not the solution, as the dragListener may be called AFTER the dropListener (on my 3.1.4GA it happens once in a while anyway).

      By digging on these forums I found some post of Alex Belov that put me on the good path. My solution was to use a nodeSelectionListener and a dropListener on the tree. Basically my backingbean is kept alive and the 2 listeners are like this :

       private TreeNode selectedNode;
      
       public void onSelectNode(NodeSelectedEvent e) {
       HtmlTree tree = (HtmlTree)e.getSource();
       selectedNode = tree.getTreeNode();
       selectedNode.getClass();
       }
      
       public void processDrop(DropEvent e) {
       HtmlTreeNode dropSource = (HtmlTreeNode)e.getSource();
       HtmlTree tree = (HtmlTree)dropSource.getParent();
       TreeNode dropNode = tree.getTreeNode();
      
       selectedNode.getParent().removeChild(selectedNode.getData());
       selectedNode.setParent(dropNode);
       dropNode.addChild(selectedNode.getData(), selectedNode);
       }


      Now, I'm not even sure I'm doing it the proper way. I think drag'n'drop in trees should be explained better in the developer's guide. Could you guys just add some paragraph about it ? Thanks.

        • 1. Re: Rich:tree and drag and drop how-to
          nbelaevski

           

          "fabmars" wrote:
          Curiously, setting a dragListener and a dropListener is not the solution, as the dragListener may be called AFTER the dropListener (on my 3.1.4GA it happens once in a while anyway).


          Yes, you're right. That needs to be reviewed, so I've dropped a note into JIRA: http://jira.jboss.com/jira/browse/RF-2227.

          What can be done for now? You can use TreeNode itself as row data, e.g.:
          public class MyTreeNode implements TreeNode {
           ...
          
           public Object getData() {
           return this;
           }
          
           ...
          
          }


          And then bind drag/drop values to data:
          <rich:tree var="node" dragValue="#{node}" dropValue="#{node}"> ... </...>


          That'll make dragged & dropped nodes available in drag (or drop) events


          • 2. Re: Rich:tree and drag and drop how-to
            tulip

            Could you please specify the RichFaces version you are using. I am using Richfaces version 3.1.3GA and tried the above code and get a ClassCastException for the second line in processDrop().

            org.richfaces.component.html.HtmlTreeNode cannot be cast to org.richfaces.component.html.HtmlTreeNode

            Thanks

            • 3. Re: Rich:tree and drag and drop how-to
              tulip

              oops -- correction - i get a classCastexception for the FIRST line of code and not the second line

              HtmlTreeNode source = (HtmlTreeNode)dragEvent.getSource();

              Thanks

              • 4. Re: Rich:tree and drag and drop how-to
                fabmars

                It depends how your tree is written in the xhtml page. If the direct parent of the treeNodde is the teee itself, it will work, but if you're using some components inbetween, you have to call getParent() as many times to get back to the tree...