1. #1
    Sencha User
    Join Date
    Nov 2008
    Posts
    56
    Vote Rating
    0
    gabriele.muscas is on a distinguished road

      0  

    Default Drag&Drop from tree to formpanel

    Drag&Drop from tree to formpanel


    Hi,
    I'm migrating a sample application from extjs3 to extjs4.

    I was able to migrate almost everything, but one thing that I can not do.

    In my app i have a drag and drop from a tree to a form panel. In the drop action i take the node id and use it.

    My code for extjs 3 was:
    Code:
    {
                        xtype:'treepanel',
                        title:'TreePanel',
                        useArrows: true,
                        autoScroll: true,
                        animate: true,
                        enableDrag: true,
                        ddGroup: 'dropGroup1',
                        containerScroll: true,
                        border: false,
    
                        root: {
                            text: 'MyRootNode',
                            expanded: true,
                            children:nodes,
                            draggable: false
                        }
                    }
    Code:
    ...form panel...
    listeners: {
        scope: this,
        render: function(myformpanel){
            dropTarget = new Ext.dd.DropTarget(myformpanel.body,{
                scope: this,
                ddGroup: 'dropGroup1',
                copy: false,
                overClass: 'over',
                notifyOver: function(dragSource, event, data){
                    return "x-dd-drag-proxy x-dd-drop-ok";
                },
                notifyDrop: function(dragSource, event, data){
                   var nodeId = data.node.id;
                   //***LOGIC HERE*****
                }
            });
        }
    }   
    ... form panel continue...
    Now with Extjs4 I can not understand how the set "drag and drop group" in tree.

    Any help will be greatly appreciated.
    Thanks,
    Gabriele

  2. #2
    Sencha - Senior Forum Manager mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    36,754
    Vote Rating
    827
    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  
    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 2008
    Posts
    56
    Vote Rating
    0
    gabriele.muscas is on a distinguished road

      0  

    Default


    Great! It seems a very powerful tool.

    I think to solve it in this way:

    Code:
    Ext.define('Ext.tree.MyTreeDDPlugin', {
        extend: 'Ext.AbstractPlugin',
        alias: 'plugin.mytreeplugin',
    
        uses: [
            'Ext.tree.TreeViewDragZone',
            'Ext.tree.TreeViewDropZone'
        ],
    
        dragText : '{0} selected node{1}',
        allowParentInserts: false,
        allowContainerDrops: false,
        appendOnly: false,
        ddGroup : "dropGroup1",
        expandDelay : 1000,
        enableDrop: false,
        enableDrag: true,
    
        init : function(view) {
            view.on('render', this.onViewRender, this, {single: true});
        },
    
        onViewRender : function(view) {
            var me = this;
    
            if (me.enableDrag) {
                me.dragZone = Ext.create('Ext.tree.TreeViewDragZone', {
                    view: view,
                    ddGroup: me.dragGroup || me.ddGroup,
                    dragText: me.dragText
                });
            }
        }
    });
    Code:
    {
    	xtype:'treepanel',
    	title:'TreePanel',
    	useArrows: true,
    	autoScroll: true,
    	containerScroll: true,
    	border: false,
    	viewConfig: {
    		plugins: {
    			ptype: 'mytreeplugin'
    		}
    	},
    
    	root: {
    		text: 'MyRootNode',
    		expanded: true,
    		children:nodes,
    		draggable: false
    	}
    }
    Thanks,
    Gabriele

Similar Threads

  1. Tree + Drag n Drop disable selection during drag
    By dustismo in forum Ext 1.x: Help & Discussion
    Replies: 5
    Last Post: 19 Oct 2011, 7:15 PM
  2. Replies: 1
    Last Post: 14 Apr 2009, 2:13 PM
  3. Replies: 2
    Last Post: 10 Dec 2008, 9:07 PM
  4. Replies: 2
    Last Post: 13 Sep 2007, 8:13 AM

Thread Participants: 1

Turkiyenin en sevilen filmlerinin yer aldigi xnxx internet sitemiz olan ve porn sex tarzi bir site olan mobil porno izle sitemiz gercekten dillere destan bir durumda herkesin sevdigi bir site olarak tarihe gececege benziyor. Sitenin en belirgin ozelliklerinden birisi de Turkiyede gercekten kaliteli ve muntazam, duzenli porno izle siteleri olmamasidir. Bu yuzden iste. Ayrica en net goruntu kalitesine sahip adresinde yayinlanmaktadir. Mesela diğer sitelerimizden bahsedecek olursak, en iyi hd porno video arşivine sahip bir siteyiz. "The Best anal porn videos and slut anus, big asses movies set..."