PDA

View Full Version : extjs 4 grid to tree drag drop



ShrutiRuparel
3 Sep 2011, 10:27 AM
i am working with grid to tree drag n drop. i am able to add new node to root of tree by dragging it from grid but i dont know how to add child to node i hovered on? i am not able to get drop target. below is my code :



Ext.define('Overdrive.view.ui.MyViewport', {
extend: 'Ext.container.Viewport',
initComponent: function() {
var me = this;
me.items = [
{
xtype: 'panel',
height: 600,
layout: {
align: 'stretch',
type: 'hbox'
},
title: 'PARENT',
items: [
{
xtype: 'treepanel',
border: '',
id: 'treepanel',
collapseDirection: 'left',
collapsible: true,
title: 'Items',


titleCollapse: true,
store: 'Test',
flex: 1,
viewConfig: {
listeners: {


render: function(tree){


var dropTarget = new Ext.dd.DropTarget(tree.el,{
ddGroup: 'gridtotree',
copy: false,

notifyDrop: function(dragSource, event, data){
var idFrom=data.records[0].data.name;
var node=Ext.getCmp('treepanel').getRootNode(); //working
node.appendChild({'text':idFrom,'children':[]});


}
});
}
}
}
},
{
xtype: 'panel',
height: 596,
flex: 3,
items: [
{
xtype: 'panel',
height: 285,
layout: {
type: 'anchor'
}
},
{
xtype: 'gridpanel',
id: 'itemtypegrid',
title: 'Item Type',
store: 'GridTest',
enableDragDrop : true,
ddText: 'Shift Row',
columns: [
{
xtype: 'gridcolumn',
width: 100,
dataIndex: 'name',
text: 'Name'
}
],
viewConfig: {
plugins: [
Ext.create('Ext.grid.plugin.DragDrop', {
ddGroup: 'gridtotree',
enableDrop: true
})
]
}
}
]
}
]
}
];
me.callParent(arguments);
}

});

vicky_menonsky
6 Mar 2012, 8:01 PM
Hey ,
did you solve the issue you had? I just solved a related issue if you are interested

healthformula
29 Mar 2012, 5:17 PM
I am stuck with the same problem can you please show what you did.

ShrutiRuparel
23 May 2012, 3:44 AM
refer here : http://www.sencha.com/forum/showthread.php?145862-extjs-4-adding-node-to-tree-panel&p=644161#post644161 Hope you get some help..