PDA

View Full Version : Dataview drag drop reorder plugin update from ExtJS 2 to ExtJS 4



gfrancis1@gmail.com
17 Aug 2015, 8:55 PM
I want to be able to reorder the items in a Dataview via drag-and-drop, exactly as in this example:
http://tof2k.com/ext/sortable/
However, this was written for Ext 2, and seems incompatible with Ext 4. I tried to update it. My attempt to replicate this functionality is here:
http://jsfiddle.net/40gz2yf1
But the items won't 'drag'. Can anyone see why? I suspect the problem is in this block:

dd.onDrag = function(e) {

var t,idx,record,data = this.dragData;
if (!data) { return false; }


try {
t = e.getTarget(v.itemSelector);
idx = v.indexOf(t);
record = ds.getAt(idx);


if (idx === data.lastIdx) { return true; }


// found new position : move record and re-add dragCls
if (t && record) {
data.lastIdx = idx;
ds.remove(data.record);
ds.insert(idx, [data.record]);
Ext.fly(v.getNode(idx)).addClass(dragCls);
return true;
}
} catch (ex) { return false; }
return false;
};

because this method never returns true - because t and record are null

jdkhamba
18 Aug 2015, 1:54 AM
Drag and drop has significantly changed over the years including syntax. You may have to rewrite your functionality for drag and drop for it to work correctly. Take a look at the example:

http://docs.sencha.com/extjs/4.2.0/#!/example/dd/dragdropzones.html