Extjs 4.1.1：网格到树拖放不起作用

Posted 2023-02-26

【中文标题】Extjs 4.1.1：网格到树拖放不起作用

【英文标题】：Extjs 4.1.1: Grid to Tree drag drop not working

【发布时间】：2014-06-20 09:19:57

【问题描述】：

我想实现这样的目标：

http://jsfiddle.net/mgill21/3HJXX/2/

但是每当我将一个节点从网格放入树列（作为叶节点）时，我都会收到诸如node.updateInfo() is undefined 和其他与节点相关的未定义方法之类的错误。

这是我的代码：

Ext.namespace('Ext.ux.window.ConfigureMobileApp');
Ext.require([ 'Ext.grid.*', 'Ext.data.*', 'Ext.dd.*' ]);

var firstGridStore = Ext.create('Ext.data.Store', 
storeId : 'formStore',
fields : [ 'name', 'type', 'itemId' ],
data : [ 
    name : "Michael Scott",
    itemId : 7,
    type : "Management"
, 
    name : "Dwight Schrute",
    itemId : 2,
    type : "Sales"
, 
    name : "Jim Halpert",
    itemId : 3,
    type : "Sales"
, 
    name : "Kevin Malone",
    itemId : 4,
    type : "Accounting"
, 
    name : "Angela Martin",
    itemId : 5,
    type : "Accounting"
 ]
);

// declare the source Grid
var firstGrid = Ext.create('Ext.grid.Panel', 
viewConfig : 
    plugins : 
        ptype : 'gridviewdragdrop',
        ddGroup : 'selDD'
    
,
store : Ext.data.StoreManager.lookup('formStore'),
columns : [ 
    text : "Name",
    flex : 1,
    sortable : true,
    dataIndex : 'name'
, 
    text : "Type",
    width : 70,
    sortable : true,
    dataIndex : 'type'
 ],
stripeRows : true,
title : 'First Grid',
margins : '0 2 0 0',
width : 200
);

 Ext.define('Resource', 
extend : 'Ext.data.Model',
fields : [ 
    name : "name",
    type : "string"
, 
    name : "type",
    type : "string"
 ]
);

var store1 = Ext.create('Ext.data.TreeStore', 
storeId : 'treeStore',
fields : [ 'name', 'type', 'itemId' ],
root : 
    expanded : true,
    children : [ 
        itemId : 171,
        type : "comedy",
        name : "Mr Bean",
        children : [ 
            leaf : true,
            itemId : 171,
            type : "actor",
            name : "Rowan Atkinson"
         ],
    , 
        itemId : 11,
        type : "fantasy",
        name : "Harry Potter",
        children : [ 
            itemId : 11,
            leaf : true,
            type : "actress",
            name : "Emma Watson",
         ]
    , 
        itemId : 173,
        type : "Action",
        name : "Fast and Furious",
        children : [ 
            itemId : 174,
            type : "actor",
            name : "Dwayne Johnson",
            children : [ 
                leaf : true,
                itemId : 175,
                type : "wrestler",
                name : "The Rock"
             ]
         ]
     ]

);

Ext.define('Ext.ux.window.TreeGrid', 
extend : 'Ext.tree.Panel',
title : 'Demo',
height : 300,
rootVisible : true,
singleExpand : true,
store : Ext.data.StoreManager.lookup('treeStore'),
columns : [ 
    xtype : 'treecolumn',
    text : 'Name',
    dataIndex : 'name',
    width : 200
, 
    text : 'Type',
    dataIndex : 'type'
 ],
initComponent : function() 
    this.callParent();
,
viewConfig : 
    plugins : 
        ptype : 'treeviewdragdrop',
        ddGroup : 'selDD'
    ,
    listeners : 
        beforedrop : function(node, data) 
            debugger;
            data.records[0].set('leaf', true);
            data.records[0].set('expanded', false);
            data.records[0].set('checked', true);
        ,
        drop : function(node, data, dropRec, dropPosition) 
            // firstGridStore.store.remove(data.records[0]);
        
    

);

var secondTree = Ext.create('Ext.ux.window.TreeGrid');

Ext.define('Ext.ux.window.ConfigureMobileApp', 
extend : 'Ext.window.Window',
title : 'Configure Mobile App',
height : 600,
width : 600,
layout : 'hbox',
modal : true,
closeAction : 'hide',
items : [ firstGrid, secondTree ]   
);

请帮忙。卡了很久。

【参考方案1】：

为了帮助您解决此错误，我向您发送了两个链接。这些不是正确的解决方案，但肯定会为您提供指导。 First Link Second Link