4

Extjs 4.07 の使用

2 つの treePanels、または 2 つのグリッドがあるとします。アイテムを 2 つの間で前後にドラッグできるようにしたいと考えています。これを行うために必要な基本的なメカニズムは何ですか? それがどのように行われるかを示すサンプルコードを見たいと思います。v3ではなくv4に適用できる、これを行う方法に関する適切なドキュメントを見つけることができませんでした。簡単な方法があることは知っており、これを行う肥大化した方法を説明する多くのドキュメントを見つけました。dd が一般的にどのように実装されているかわかりません。したがって、高レベルの概要も役立ちます。

4

2 に答える 2

4

グリッドにはDragDropプラグインがあり、ツリーにはTreeViewDragDropプラグインがあります。

グリッドまたはツリーから、またはグリッドまたはツリー内にドラッグする場合は、プラグインを含めます。グリッドの場合、次のようになります。

Ext.create('Ext.grid.Panel', {

    ...

    viewConfig: {
        plugins: {
            ptype: 'gridviewdragdrop',
            dragText: 'Drag and drop to reorganize'
        }
    },

    ...

});

プラグインが組み込まれると、コンポーネントからドラッグ アンド ドロップ イベントが取得され、リッスンできます。上記の例を完成させます。

Ext.create('Ext.grid.Panel', {

    …

    viewConfig: {
        plugins: {
            ptype: 'gridviewdragdrop',
            dragText: 'Drag and drop to reorganize'
        },

        listeners: {
            drop: function(node, data, dropRec, dropPosition) {
                // Do something here.
            }
        }        
    },

    …

});

この例とそれに対応するコードで、これが完全に機能していることを確認できます。

私の知る限りでは、4.07 と 4.1 の間でこの面で何も変わっていません。

于 2012-08-07T22:21:52.877 に答える
1

General overview of drag and drop

Also check the custom drag drop to a grid http://docs.sencha.com/ext-js/4-1/#!/example/dd/dragdropzones.html

general idea is that , you have to create 1. draggable element On receipt of a mousedown event. Return a drag data object if so. The data object can contain arbitrary application data, but it should also contain a DOM element in the ddel property to provide a proxy to drag. 2. drop zone , where you decide what to do on 'onNodeDrop' event

于 2012-08-08T09:02:47.840 に答える