4 Replies Latest reply on Feb 1, 2009 8:34 AM by nbelaevski

    Select Tree Node with JavaScrip

    zjda

      Hi, I want to use JavaScript to select a tree node after some operations on the tree (e.g. select the Drag&Dropped node or the newly created node). In this way, other part of the page will be automatically refreshed. The JavaScript function could be called in ondrop or oncomplete event. Could someone show me some sample code?

      The second question: is it possible that Drag&Drop can be combined with function keys? For example, Drag&Drop will move object while Drag&Drop with "Ctrl" key pressed will copy the object.

      Thanks,
      -ZJ

        • 1. Re: Select Tree Node with JavaScrip
          nbelaevski

          Try this: [
          code] function setSelection(e) {
          var elt = Event.element(e);
          //find component and toggle selection
          var treeItem = Tree.Item.findComponent(elt);
          if (treeItem.tree.selectionManager.activeItem != treeItem) {
          treeItem.toggleSelection(e);
          }
          }

          • 2. Re: Select Tree Node with JavaScrip
            nbelaevski

            Sorry.

            Try this:

            function setSelection(e) {
             var elt = Event.element(e);
             //find component and toggle selection
             var treeItem = Tree.Item.findComponent(elt);
            if (treeItem.tree.selectionManager.activeItem != treeItem) {
             treeItem.toggleSelection(e);
            }
             }
            

            "e" argument stands for event object.

            It's not possible to check function keys out of the box for D'n'D, I think you can code that manually.

            • 3. Re: Select Tree Node with JavaScrip
              zjda

              Hi Nick, Thank you for your answer and sample code. However, I have a couple of problems with the javascript. First, it is difficult to get node object. I tried the different D'n'D events, but they all gave me the receiver node. Furthermore, when the node is highlighted with a rectangle by using toggleSelection, it does not fire selection event.

              Now I figure out that I can do it in the backbean drop listener:

              ListRowKey<Long> targetRowKey = (ListRowKey<Long>) tree.getTreeNodeRowKey(target);
              ListRowKey<Long> rowKey = new ListRowKey<Long>(targetRowKey, source.getData().getObjectID());
              treeState.setSelected(rowKey);
              


              Where I use objectID as the rowkey.

              Again, your reply is appreciated.
              -ZJ

              • 4. Re: Select Tree Node with JavaScrip
                nbelaevski

                Ok, so here is how to get drag source and drop receiver on client side:

                ondragstart="window.status = ('drag:' + window.drag.source)" ondrop="window.status = ('drag:' + window.drag.source)+('drop:' + this)"

                For the case of tree component both variables point to an instance of Javascript class Tree.Item and you can invoke toggleSelection(event) on any of them.

                For the case of server-side there's a special adviseNodeSelected attribute that should point to a method receiving UITree and returning java.lang.Boolean. See Javadoc of org.richfaces.component.state.TreeStateAdvisor class for more information about this method.