PDA

View Full Version : Draggable List Items



s.t.a.s
6 Apr 2012, 5:39 AM
How to make list items to be draggable? I want to let user drag each list item horisontally (and under item then I'll place options icons like in Twitter). Now I try to do that so:


onItemTouchStart: function (component, index, target, record, eventObject, options) {
//target.setDraggable({direction: 'horizontal'});

var activeEl = Ext.get(target);
Ext.util.Draggable(activeEl, {});
}


On target.setDraggable({direction: 'horizontal'}) I get error message "Object [object Object] has no method 'setDraggable'".
But on Ext.util.Draggable(activeEl, {}); I get nothing. I mean behavior absolutely the same as before and I can't drag item.

Is it possible to do that?

mitchellsimoens
6 Apr 2012, 5:46 AM
try


new Ext.util.Draggable({
element : someEl
});

s.t.a.s
6 Apr 2012, 5:57 AM
try


new Ext.util.Draggable({
element : someEl
});

Yeah, you right. It let me drag item vertically. But why when I set direction to 'horisontal' or 'both' nothing happens. I can't drag it horisontally.

s.t.a.s
6 Apr 2012, 6:21 AM
I've found a solution only in the sources (but not in documentation).
Can be useful for everyone (I hope).


onItemTouchStart: function (component, index, target, record, eventObject, options) {
var activeEl = Ext.get(target);
var d = new Ext.util.Draggable({
element: activeEl,
direction: 'horizontal'
});
d.setExtraConstraint({
min: { x: 0, y: 0 },
max: { x: 600, y: 0 }
});
}

iSmartDevice
10 Jun 2012, 11:04 AM
Hi,
I've been implementing a list having some options in a list item like Twitter as you did. I got an error.



Uncaught TypeError: Cannot call method 'translate' of undefined Draggable.js:342


I know there is a plugin for this with ST 1.1 and tried to port it with ST 2.0. It seems there are so many things to do from the ground.

Is there any way to implement a list like Twitter?

Thanks in advance!