Announcement

Collapse
No announcement yet.
X
  • Filter
  • Time
Clear All
new posts

    Drag and Drop on leaf nodes

    I set up a TreeGrid to accept drag and drop on leaf nodes:

    ...
    canDropOnLeaves: true,
    canReparentNodes: true,
    canReorderRecords: true,
    dragDataAction: "move",
    ...

    The intention is that any node (leaf or folder) can being dropped onto any other node (leaf or folder) for reparenting.

    All works as advertized. However there is one minor UI issue that causes some confusion. When canReorderRecords is set to true, a 'separator line' appears between each node as the mouse moves. It's difficult to tell which node you are actually dropping onto and in fact the separator line in this instance is counter-intuituive since one would expect the drop node to be the one above the separator line not below it. Technically, canReorderRecords gives a false impression of what we would like to see.

    If I turn canReorderRecords off, folderDrop() never gets executed in the cases where both drag and drop nodes share the same parent. Is there any combination of switches I can set to both highlight the actual node the mouse is hovering over as well as insure folderDrop() gets called with the correct arguments?

    Thanks for your help,
    -paul

    #2
    BTW - still on rel 7

    Comment


      #3
      Would love to see an equivalent version of folderDrop() (maybe nodeDrop()?) that would work with just the following switches:

      canDropOnLeaves: true,
      canReparentNodes: true,
      dragDataAction: "move",
      ...

      that takes the same arguments (nodes, folder, index, sourceWidget) with the distinction that the folder being dropped onto is the actual leaf.

      Also, would love some switch that would turn on node highlighting during drag and drop when the mouse is over a drop node.

      -paul

      Comment


        #4
        Use these settings:

        Code:
                canDragRecordsOut:true,
                canAcceptDroppedRecords: true,
                canDropOnLeaves: true,
                dragDataAction: "move"
        canReparentNodes won't work because you're dropping on leaves, not parents.

        Comment


          #5
          I tried these switches but they still prevent dropping a leaf node onto another leaf when they both share the same parent. ("The item already contains a child with that name." - message)

          Specifically, the situation is as follows:

          parent1
          child1
          child2

          I'm trying to drop child1 onto child2.

          -p

          Comment


            #6
            If this is a legal situation for you then you'll also need to override willAcceptDrop() to return true in this case.

            Comment


              #7
              I tried overriding willAcceptDrop() but folderDrop() is still not being executed. (i.e. still getting "The item already contains a child with that name." message)

              I made willAcceptDrop() as general as possible just to test:

              []
              willAcceptDrop: function() {
              if (this == EventHandler.getDragTarget()) {
              return true;
              }
              return false;
              },
              [/]


              Can't seem to get by the grid checking for children with the same parent.

              -p

              Comment


                #8
                Sorry about the formatting -

                Code:
                willAcceptDrop: function() {
                if (this == EventHandler.getDragTarget()) {
                return true;
                }
                return false;

                Comment


                  #9
                  Ah, sorry, because this is a drop on a leaf, folderDrop does not apply (no folder). Instead, add a handler for the earlier and more general DropEvent. This will bypass all checks, but doesn't provide the same convenience parameters - you can find out the coordinate that was dropped on via getEventRow().

                  Comment


                    #10
                    I can't seem to find DropEvent in the docs. I assume you mean do something like this:

                    Code:
                    canAcceptDrop: true,
                    drop: function() {
                      // handle the drop here
                      var widget = EventHandler.getDragTarget();
                      if (widget == this) {
                         var row = this.getEventRow();
                         var record = this.getRecord(row);
                       // etc
                    }

                    Comment


                      #11
                      Yes, exactly. "drop" is an event inherited from Canvas.

                      Comment


                        #12
                        I have a tree that has folders AND leaves that can be dropped on...when I provide a "drop" event for the treegrid, it always calls that and does not look to call folderDrop..how do I provide the drop event ONLY for tree nodes that are leaves and folderDrop for tree nodes that ARE folders?

                        Comment


                          #13
                          If you have overridden drop, call Super() to have folderDrop still be called normally.

                          Comment


                            #14
                            Hmm..ok. onFolderDrop is called properly now...but I'm back to square one with my problem. I have a tree node that is marked as isFolder=false, my tree grid is marked as canDropOnLeaves=true, but when I try to drop an object into that node, I see the forbidden sign and on drop method has not been called...you mentioned that providing the drop method skips on drop validation?

                            Comment


                              #15
                              willAcceptDrop() is called to determine drop eligibility. This method is overriden on TreeGrid with docs that explain TreeGrid-specific checks that it performs - take a look at these docs for various cases that could apply and would forbid dropping.

                              Comment

                              Working...
                              X