[OPEN-694] scroll:true messes up Ext.util.Draggable in Ext.DataView

[Fredric Berling]

Sencha Touch version tested:

• 1.01

• only default ext-all.css

Platform tested against:

• iOS 4 on Ipad
• Safari on Mac (Latest version)

Description:

• When a Dataview is set to "scroll:true" the drag constraint is limited to the dataview itself. (can not be dragged to other components outside the layout)
  

Test Case:

   Ext.regModel('User', {
    fields: [
        {name: 'name', type: 'string'}
    ]
});


Ext.regApplication({
    name: "Test",
  	launch: function(){
		droplist = new Ext.DataView({
			scroll:true,
			flex:1,
  			store: new Ext.data.Store({
				model:'User',
				data:[
					{name:'Fredric Berling'},
					{name:'Bruce Springsteen'},
					{name:'Michael Jackson'}
				]
			}),
            tpl : [
				'<tpl for=".">',
                '<div class="draggableDiv">{name}</div>',
				'</tpl>'
            ],
			itemSelector: 'div.draggableDiv'
        });
		droplist.on('afterrender', function(){
		
			droplist.on({
			    	itemtap: this.createDragElement,
			    	scope:this
			});
		}, this);
	
        this.viewport = new  Ext.Panel({
			fullscreen:true,
            application: this,
			layout: {
			        type: 'hbox',
			        align: 'stretch'
			 },
	   		items:[{xtype:'container', html:'drop here if you can', width:300 },droplist]
        });
        
        
    
    },createDragElement:function(dw, index, item, e){
			var dragItem = new Ext.util.Draggable(item, {
				revert:true,
				constrain:null
			});
	}

});

Steps to reproduce the problem:

• Try crappy example above.. Click list item once for creating draggable.
• Now release mouse and try to drag the name item onto the left area.
• This doesnt work in my environment
• Now change scroll to false and reload page.
• Drag again into left panel. It should work

The result that was expected:

• Dragging item into left panel
  

The result that occurs instead:

• Item can only be dragged inside its own container. (the dataview)
  

[jmilly]

Does anyone have a fix for this?

[AloneWalker]

I searched how to this bug solve but i cant find any suitable soulition. Then today when i'm looking for solution, i changed to senhca main css file
from x-scroller-parent{overflow:hidden !important;}
to x-scroller-parent{}

Now it working. But i think that it is not a good solution as well.

[David55]

Do you have answer about this problem because i have the same and i implement AloneWalker 's solution but it is not a very good solution i think (but it works)