Hybrid View

  1. #1
    Sencha User
    Join Date
    Nov 2011
    Posts
    16
    Vote Rating
    0
    kebuu is on a distinguished road

      0  

    Default How to enable DragNDrop only on TreeView leaves

    How to enable DragNDrop only on TreeView leaves


    Hello everybody,

    I'm currently working with ExtJs 4 TreeView and DragNDrop, and I can't find an easy way to allow drag only for the leaves of my tree (ie. I don't want to be allowed to drag folders). I looked for events such as 'beforenodedrag' or any obvious configuration of the DnD plugin but it doesn't seem to exist.

    Did I miss something ?

    My code is the following :

    Code:
    Ext.define('PlayExt.view.tree.SerieTreeOther' ,{
        extend: 'Ext.tree.Panel',
        
        alias: 'widget.serieTreeOther',
    
    
        store: Ext.create('Ext.data.TreeStore', {
    	    autoLoad: true, 
    	    root: {
    	        expanded: true,
            	text: "Tout ce que je n'ai pas"
    	    },
    	    
    	    proxy: {
    	    	type: 'ajax',
    	        url : '/treeNotUser'
    	    },
    	    
    	    sorters: [
    	        {
    	            property : 'text',
    	            direction: 'ASC'
    	        }
    	    ]
    	}),
    	
    	viewConfig: {
            plugins: {
                ptype: 'treeviewdragdrop',
                dragGroup: 'otherBooks',
                dropGroup: 'collectionBooks'
            }
        },
        
        rootVisible: true
    });
    Regards

  2. #2
    Sencha - Senior Forum Manager mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    37,217
    Vote Rating
    859
    mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute

      0  

    Default


    Look at the source for the TreeViewDragDrop plugin. See how it creates the ViewDrapZone and ViewDropZone... tracing it up the class hierarchy you can see a few template methods that may be helpful to you.
    Mitchell Simoens @SenchaMitch
    Sencha Inc, Senior Forum Manager
    ________________
    Check out my GitHub, lots of nice things for Ext JS 4 and Sencha Touch 2
    https://github.com/mitchellsimoens

    Think my support is good? Get more personalized support via a support subscription. https://www.sencha.com/store/

    Need more help with your app? Hire Sencha Services services@sencha.com

    Want to learn Sencha Touch 2? Check out Sencha Touch in Action that is in print!

    When posting code, please use BBCode's CODE tags.

  3. #3
    Sencha User
    Join Date
    Nov 2011
    Posts
    16
    Vote Rating
    0
    kebuu is on a distinguished road

      0  

    Default


    Hello,

    I found two ways to do what I wanted :

    - First I could simply take advantage of the method "isPreventDrag" from 'Ext.tree.ViewDragZone'
    and set the property 'allowDrag' to false for undraggable nodes. Here is the code of this method :
    Code:
    ....isPreventDrag: function(e, record) {        return (record.get('allowDrag') === false) || !!e.getTarget(this.view.expanderSelector);    }
    - Another way is to override the method "isPreventDrag" like this :

    Code:
    Ext.override(Ext.tree.ViewDragZone, {
    	isPreventDrag: function(e, record) {
    	    return this.callOverridden(arguments) || !record.isLeaf();
    	} 
    });
    The problem with this second method is that I override the "isPreventDrag" method for all the treeviewdragdrop plugins in my app. How can I override the default behavior only for one tree (I think I can extend the treeviewdragdrop plugin and use mine instead of the built-in plugin but it seems overkill, no) ?

    Regards

    PS: For some reasons, the class ViewDragZone is not available from the api http://docs.sencha.com/ext-js/4-0/#!...e.ViewDragZone (I get infinite loading)

    [COLOR=#fafafa !important]

    [/COLOR]

Thread Participants: 1

Tags for this Thread