PDA

View Full Version : ItemSelector now working while using DropZone



agustincba
3 Oct 2013, 5:49 AM
Hi !. I have the following problem... While building a Drag and Drop example, I am able to drag a row from one grid but I am unable to drop it on another grid, although I have set a value in the itemSelector property from the view... I have run my app and wbhile inspecting the dom, I haven't seen the value of this property in the attributes of the components... So I can't get the target where to drop my data...

I am using Ext JS 4.2.1 and the code is...

var grid2 = Ext.create("Ext.grid.Panel", {
id: 'segunda',
margin: '30 0 0 0',
width: 250,
height: 150,
columns: [
{ text: "Name", dataIndex: "name" },
{ text: "Age", dataIndex: "age"}
],
renderTo: Ext.getBody(),
viewConfig: {
itemSelector: 'cholo'
},
selModel: Ext.create('Ext.selection.RowModel',{
mode: 'SINGLE'
})
});
alert(grid2.getView().itemSelector);
Ext.create('Ext.dd.DropZone','segunda', {
getTargetFromEvent: function (e) {
var targetFromEvent = e.getTarget(grid2.getView().itemSelector);
if(!targetFromEvent)
{
targetFromEvent = document.createElement('span');
targetFromEvent.id = 'nulo';
}

return targetFromEvent;
},
onNodeDrop: function (target, dd, e, data) {
var container = document.getElementById('container');
container.innerHTML = data.ddel.innerHTML;
grid2.getStore().add(data.draggedRecord);
gridp.getStore().remove(data.draggedRecord);
return true;
},
onNodeOver : function(target, dd, e, data){
return Ext.dd.DropZone.prototype.dropAllowed;
}
});

slemmon
14 Oct 2013, 2:08 PM
Have you tried to implement the grid drag and drop with the gridviewdragdrop class (Ext.grid.plugin.DragDrop (http://docs.sencha.com/extjs/4.2.2/#!/api/Ext.grid.plugin.DragDrop)) instead?