Page 2 of 3 FirstFirst 123 LastLast
Results 11 to 20 of 23

Thread: [2.0rc1/2.0.1] TreePanel: Dropping onto a Leaf Node

  1. #11
    Ext User
    Join Date
    Nov 2007
    Posts
    2
    Vote Rating
    0
      0  

    Default Workaround

    I guess this bug wasn't fixed for the 2.0 release. Shame. For the other posters, here's a workaround that I'm playing with that SEEMS to work all right thus far.

    The custom loader prevents needless XHR requests.
    PHP Code:

        
    // custom treeloader so that we can treat '!has_children' more or less as
        // leaf, but still take advantage of the default drag & drop (which, by
        // default, will not allow appends to leaf - see possible bug
        // http://extjs.com/forum/showthread.php?t=17522&highlight=drop+leaf+node
        //  - this is only needed (in leiu of leaf => true|false) because we
        //  allowing appending to 'leaf' nodes, dynamically turning them into
        //  interior nodes
        
    var treeLoader =new Ext.tree.TreeLoader({
            
    dataUrl'/resource/children'
        
    })
        
    treeLoader.on('beforeload', function(treenode) { 
            if(
    node.attributes.has_children == false)
                return 
    false
        
    })

        
    config config || {}
        
    MyClass.superclass.constructor.call(thisExt.apply({
            
    el:                 'pad',
            
    loader:             treeLoader,

            
    autoScroll:         true,
            
    animate:            true,
            
    enableDD:           true,
            
    containerScroll:    true

           
    // , ... other params for toolbar, etc.
        
    },config)) 
    The event handler 'expands' the leaf nodes to get the right icon (and more importantly, to eliminate the expand toggle).
    PHP Code:
        this.on('append', function(treeparentNodenewNodenewNodeIndex) {
            if(
    newNode.attributes.has_children == false) {
                
    newNode.render()
                
    newNode.expand(false)
            }
        }) 
    With the above, I make sure that children are loaded with no 'leaf' attribute (letting it default to false), but with has_children set appropriately.

  2. #12
    Ext User
    Join Date
    Aug 2007
    Posts
    23
    Vote Rating
    0
      0  

    Default

    for Ext 1.1.1 find in ext-all.js:
    var H=J.allowChildren===false||J.isLeaf();
    and replase on:
    var H=J.allowChildren===false;

  3. #13
    Ext User
    Join Date
    Oct 2007
    Posts
    2
    Vote Rating
    0
      0  

    Default great change, but how do you manage the icon?

    If I add the following to my ext-all.js with the 1.1 version. My leaf does accept children however, the icon for the node remains a leaf and not a folder. Do you know how I would go about declaring the image of the said node to automatically have the folder icon?


    var H=J.allowChildren===false;

  4. #14
    Ext User
    Join Date
    Apr 2007
    Posts
    3
    Vote Rating
    0
      0  

    Post

    我的办法是重载Ext.data.Node,添加一个setLeaf方法,然后在tree的append事件中把节点的leaf都设为false。
    PHP Code:
    Ext.override(Ext.data.Node, {
        
    setLeaf: function(value){
        
    this.leaf value;
    }
    }); 
    PHP Code:
    this.on('append',function(tree,p,n,index){
        
    n.setLeaf(false);
    }); 
    欢迎加入37921608群(QQ)一起研讨Ext。

  5. #15
    Ext User schmidetzki's Avatar
    Join Date
    Mar 2007
    Location
    Germany
    Posts
    110
    Vote Rating
    0
      0  

    Default

    Quote Originally Posted by hjdivad View Post
    I guess this bug wasn't fixed for the 2.0 release. Shame. For the other posters, here's a workaround that I'm playing with that SEEMS to work all right thus far.
    Thxs. That solved my problem.
    To the general discussion about bug/no-bug:
    Testing for isLeaf() is not realy the bug. It-s OK. leaf==tue means that the node may never have children (like a document in a directory tree).
    The bug is however, that the treeloader automaticaly adds a plus sign if leaf==false (therefore you may never have empty directories)
    The plus sign should only triggerd by something like node.hasChildren and nothing else.

  6. #16
    Sencha User Keri Henare's Avatar
    Join Date
    May 2009
    Location
    Auckland, New Zealand
    Posts
    3
    Vote Rating
    0
      0  

    Default

    I believe that I have found an incredibly simple solution to this problem.

    When the server returns the JSON response for the tree I add the following parameters:
    Code:
    'expanded' => !$node->hasChildren(),
    'loaded' => !$node->hasChildren()
    And to the TreePanel I add:
    Code:
    baseAttrs: {
        allowChildren: true,
        leaf: false
    }
    So basically, if the node has no children then it still isn't a leaf (because a leaf can't have children) but as far as the TreePanel is concerned it has already been expanded and had it's children loaded.

    expanded - Expands the node and (as the node has no children) displays a page icon instead of a folder icon.

    loaded - Tells TreePanel not to make another request to get this nodes children, so no extra HTTP request and no spinning loading icon.

    This has worked perfectly for me and is very simple.
    Last edited by Keri Henare; 5 May 2009 at 8:59 PM. Reason: No sig

  7. #17
    Ext User
    Join Date
    Jul 2009
    Posts
    1
    Vote Rating
    0
      0  

    Default

    Thanx Keri, this is exactly the simple solution I was searching for.

    Romanticus

  8. #18
    Sencha Premium Member
    Join Date
    Aug 2007
    Location
    The Netherlands
    Posts
    53
    Vote Rating
    3
      0  

    Default Thanks!

    Thanks again Keri, excellent sollution and it still works for Ext 4.1 !

  9. #19

  10. #20
    Sencha User
    Join Date
    Mar 2014
    Posts
    1
    Vote Rating
    0
      0  

    Default Dropping onto leaf node

    Code:
    You can add:
     viewConfig: {
                            listeners: {
                                beforedrop: function (node, data, dropRec, dropPosition, eOpts) {
                                       eOpts.cancelDrop();
                                        dropRec.set('expanded', true);
                                        dropRec.set('leaf', false);
                                        dropRec.appendChild(data.records[0]);
    },                            drop: function (node, data, dropRec, dropPosition) {
                                    // //debugger;
                                    var dropOn = dropRec ? ' ' + dropPosition + ' ' + dropRec.get('text') : ' on empty view';
                                }
    },
    
                            plugins: {
                                ddGroup: 'user-dd',
                                dragGroup: 'user-dd',
                                ptype: 'treeviewdragdrop',
                                appendOnly: false
                            }
    }
    
    to the Ext.tree.Panel definition.
    
    It will add the record to the leaf node as well as other nodes as desired

Page 2 of 3 FirstFirst 123 LastLast

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •