extjs 4 网格到树拖放答案

【问题标题】：extjs 4 grid to tree drag dropextjs 4 网格到树拖放
【发布时间】：2011-09-03 18:32:04
【问题描述】：

我正在使用网格来拖放树。我可以通过从网格中拖动它来将新节点添加到树的根，但我不知道如何将子节点添加到我悬停的节点？我在 dis 上花了 2 天，但没有运气。下面是我的代码：

  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);
        }

【问题讨论】：

标签： drag-and-drop tree grid extjs4

【解决方案1】：

要捕获树节点，您可以将此处理程序添加到 Tree.Panel -> ViewConfig -> 侦听器：

itemmouseenter: function (view, model, htmlItem, index, e)
{
 console.log(model);
},

您可以保存此值并在另一个处理程序中使用 - notifyDrop

【讨论】：