ExtJS Drag& Drop给出" TypeError:路径未定义"在下降

时间:2017-05-02 14:52:18

标签: extjs

我使用ExtJS 6.0.1并希望从树上拖动项目,以便我可以将某些类别值更改为网格记录。

但是在掉线事件中我收到了这个错误:" TypeError: path is undefined"。该错误由Ext.tree Panel类,第一行的函数ensureVisible返回。

        var foldersStore = Ext.create("Ext.data.TreeStore",{
                storeId: 'foldersTreeStore',
                proxy: {
                    type: 'ajax',
                    url: 'categories/tree.json'
                },
                autoLoad: true
            });

            var foldersTree = Ext.create("Ext.tree.Panel",{
                title: 'Categories',
                hideHeaders: true,
                renderTo: 'folders-tree',
                rootVisible: false,
                allowDeselect: true,
                store: foldersStore,
                droppedRecords: undefined,
                viewConfig: {
                    plugins: {
                        ptype: 'treeviewdragdrop',
                        dragText: 'Drag and drop to reorganize',
                        dropGroup: 'bkmDDGroup',
                        appendOnly: true
                    },
                    listeners: {
                        beforedrop: function(node, data, overModel, dropPos, opts) {
                            this.droppedRecords = data.records;
                            data.records = [];

                            console.log(this.droppedRecords);
                        },
                        drop: function(node, data, overModel, dropPos, opts) {
                            console.log(arguments);
                        }
                    }
                }
            });

            var filesStore = Ext.create("Ext.data.Store",{
                storeId:'filesTableStore',
                fields:[
                    {name: 'eid', type:'string'},
                    {name: 'fileName', type:'string'},
                    {name: 'createdAt', type:'string'},
                    {name: 'mimeType', type:'string'},
                    {name: 'version', type:'string'},
                    {name: 'size', type:'int'},
                    {name: 'creator', type:'string'},
                    {name: 'modifier', type:'string'},
                    {name: 'status', type:'string'},
                    {name: 'tmpId'}
                ],
                proxy: {
                    type: 'ajax',
                    url: 'documents/list.json',
                    reader: {
                        type: 'json',
                        rootProperty: "list"
                    }
                },
                autoLoad: true
            });

            var filesTable = Ext.create("Ext.grid.Panel",{
                store: filesStore,
                title:'Files',
                selModel: {
                    mode: "MULTI",
                    allowDeselect: true
                },
                columns:[
                    {
                    text:'File Name',
                    flex:1,
                    dataIndex:'fileName'
                },{
                    text:'Created By',
                    flex:1,
                    dataIndex:'creator'
                },{
                    text:'Mime Type',
                    width: 150,
                    dataIndex:'mimeType'
                },{
                    text:'Size',
                    width: 100,
                    dataIndex:'size'
                },{
                    text:'Version',
                    width: 80,
                    dataIndex: 'version'
                },{
                    text:'Status',
                    width: 100,
                    dataIndex:'status'
                },{
                    text:'Created At',
                    width:150,
                    dataIndex:'createdAt'
                }],
                renderTo:'files-table',
                height:UI.getContentHeight("#files-table"),
                viewConfig: {
                    plugins: {
                        ptype: 'gridviewdragdrop',
                        dragText: 'Drag and drop to reorganize',
                        dragGroup: 'bkmDDGroup'
                    }
                }
            });

从我的观点来看,我已经忘了一些配置,但还没有任何想法。即使我在drop事件中有一个console.log行,错误仍然是相同的。

任何线索都将非常感激。 感谢

1 个答案:

答案 0 :(得分:0)

在前置监听器中,您将删除您选择的记录:

data.records = []

相反,您必须准备好将记录放入TreePanel,其中数据模型与网格不同。

Link实现