Question

在从树拖到另一棵树时遇到ExtJS问题。

我有一棵树sourceTree，它具有可以拖动的所有元素。

我有另一棵树targetTree，它希望包含从源树中拖动（选中）的所有元素。

var sourceStore = Ext.create('Ext.data.TreeStore', {
    model: 'MyTreeModel',
    proxy: {
        type: 'ajax',
        url: '/some_action_that_returns_tree_json',
        extraParams: { /*extra params*/
        },
        reader: {
            type: 'json',
            root: function (o) {
                if (o.children == null) {
                    return o.children;
                } else {
                    return o;
                }
            }
        }
    },
    folderSort: true
});

源树定义为：

{
    xtype: 'treepanel',
    flex: 5,
    iconCls: 'myiconcls',
    border: true,
    store: formstore,
    loadMask: true,
    rootVisible: false,
    title: 'Source',
    bodyStyle: 'font-style:bold',
    viewConfig: {
        plugins: {
            ptype: 'treeviewdragdrop',
            appendOnly: true
        }
    }
}

所以我有一个可以拖动的源代码树。

目标树定义为：

{
     xtype: 'treepanel',
     flex: 5, iconCls: 'mytreecls',
     border: true, 
     store: emptystore,
     rootVisible: false,
     title: 'Selected', 
     bodyStyle: 'font-style:bold',
     viewConfig: {
        emptyText: '',
        plugins: {
           ptype: 'treeviewdragdrop',
           allowContainerDrop: true,
           appendOnly: true
        },
        listeners: {
            drop: function (node, data, model, dropPosition, opts) {
                console.log(node);
            }
        }
    } 
}

我遇到的第一个问题是如何定义一个空树库，如果没有加载节点的数据，它将使用一个根节点来调用代理URL。

源树将动态加载叶子节点，如果我将它们拖动并添加到目标树，我想保留该功能。

我已经尝试了很多方法来设置默认的根节点 - 没有一个我能够工作。

var emptystore= Ext.create('Ext.data.TreeStore', {
    model: 'TreeModel',
    proxy: {
        type: 'ajax',
        url: '/some_action_that_returns_tree_json',
        extraParams: { ... },
        reader: {
            type: 'json',
            root: { text:"My Root",...} // doesn't work, presumably becuase the ajax call overwrite it?
            }
        }
    }
});

最终结果应该是我可以从另一棵树拖动的源树。我不想删除我认为由appendOnly treeviewdragdrop属性控制的拖动节点。我试图通过将allowContainerDrop设置为true来处理面板/容器上的拖放。

说实话，这是我第一次进入ExtJS D＆amp; D，所以任何帮助表示赞赏。我显然已经阅读了教程，但找不到我在树上的树D＆amp; D.

提前致谢，

山姆

ExtJs 4 - 从Tree拖动到“空”树

0 个答案: