Events ExtJS4：从树拖动到面板

我在使用ExtJS4时遇到了一个问题

我的应用程序有一个树，其中包含一个表示员工的字符串。
在这棵树中，拖放操作非常有效。
现在我正在尝试创建一个面板，可以将员工拖到其中删除

因此，我让ExtJS创建一个新的Ext.dd.DDTarget，根据需要定义dragzone（这是有效的部分，因为它被认为是删除的有效目标）。。。但当我解雇员工时，什么也没发生。我只是不知道该使用哪一个侦听器以及具体在哪里使用它

我真的不知道，我应该在我的代码的哪一部分发布这个问题来支持你支持我（：D）。。。因此，我只需发布我认为应该发布的内容，并在缺少内容时编辑此帖子…：-）

这是我的目标：

 var trashDDTarget = Ext.create('Ext.dd.DDTarget', 'trashTarget', 'trashDrag');

  var trashPanel = Ext.create('Ext.panel.Panel', {
title: 'Trash!',
id: 'trashTarget',
width: 400,
height: 150,
renderTo: 'trash',
bodyStyle: 'background-image: url(/images/trash_can.png) !important'
});

其中“trashTarget”是面板（如下），而“trashDrag”是dragGroup的名称

目标面板：

 var trashDDTarget = Ext.create('Ext.dd.DDTarget', 'trashTarget', 'trashDrag');

  var trashPanel = Ext.create('Ext.panel.Panel', {
title: 'Trash!',
id: 'trashTarget',
width: 400,
height: 150,
renderTo: 'trash',
bodyStyle: 'background-image: url(/images/trash_can.png) !important'
});

这是我解决这个问题的想法之一：

  Ext.override(Ext.dd.DDTarget, {
onDragDrop  : function(evtObj, targetElId) {
  console.log(evtObj);
},
onInvalidDrop: function(evt) {
  console.log(evt);
}
});

覆盖一些听众；但它不起作用。
我希望我没有把你弄糊涂，也许有人能帮我…：-）

提前感谢
吉拉拉斯

---------------------------- 更新：

 var trashDDTarget = Ext.create('Ext.dd.DDTarget', 'trashTarget', 'trashDrag');

  var trashPanel = Ext.create('Ext.panel.Panel', {
title: 'Trash!',
id: 'trashTarget',
width: 400,
height: 150,
renderTo: 'trash',
bodyStyle: 'background-image: url(/images/trash_can.png) !important'
});

我将面板更改为gridpanel…
当我将项目拖到上面时，它会从树中消失…
... 但它似乎不会触发文档中指定的任何事件…
我的新面板如下所示：

 var trashPanel = Ext.create('Ext.grid.Panel', {
title: 'Trash!',
id: 'trashTarget',
width: 400,
viewConfig: {
  plugins: {
    ptype: 'gridviewdragdrop',
    dropGroup: 'trashDrag',
    dragGroup: 'trashDrag',
    dragText: 'In den Papierkorb ziehen, um zu löschen...'
  }
},
height: 150,
renderTo: 'trash',
columns:[
  {
    hidden: true
  }
],

bodyStyle: 'background-image: url(/images/trash_can.png) !important'
});

---

但不知怎么的，这也不管用

嗯，好吧，我想我找到了解决办法；-）
可能不是最好的，但足够满足我的需要：D
我将在这里发布我的解决方案，这样也许有一天在这个主题上寻求帮助的人会找到它：-）

我的问题（我的想法是错误的）是，我不知道去哪里看比赛。。。或者至少现在，当在gridpanel的视图配置中捕获它时，它可以工作：-）

这是我的新面板：

var trashPanel = Ext.create('Ext.grid.Panel', {
title: 'Trash!',
id: 'trashTarget',
width: 400,
viewConfig: {
  plugins: {
    ptype: 'gridviewdragdrop',
    dropGroup: 'trashDrag',
    dragGroup: 'trashDrag',
    dragText: 'In den Papierkorb ziehen, um zu löschen...'
  },
  listeners: {
    drop: function(node, data, overModel, dropPosition) {
      console.log('Mitarbeiter mit ID ' + data.records[0].internalId + ' gedropt!');
      var antwort = function(btn){
        if(btn.indexOf('no') != -1){
          treeStore.load();
        } else {
          Ext.Ajax.request({
              url: '/app/loeschenPage',
              params:
              {
                id: data.records[0].internalId
              },
              method: 'GET',
              success: function() {
                Ext.MessageBox.alert("Und tschüss...", "Mitarbeiter erfolgreich aus der Datenbank gelöscht.");
                treeStore.load();
              }
            });
        }
      };
      Ext.MessageBox.confirm('Wirklich löschen?', 'Soll der Mitarbeiter WIRKLICH FUER IMMER geloescht werden? Das ist eine sehr lange Zeit...', antwort);

    }
  }
},
height: 150,
renderTo: 'trash',
columns:[
  {
    hidden: true
  }
],

bodyStyle: 'background-image: url(/images/trash_can.png) !important'
});

---

无论如何，谢谢你，写下我的问题确实帮助我以另一种方式思考它：-）

为了防止从树中删除数据，你应该在viewConfig中设置属性：

viewConfig:{ copy: true; }

---

好吧，它一直在删除我的“大家好：-）”，所以想象一下-波凯，解决了。。。但是由于我还没有被允许发布我的解决方案。。。我以后再做；-）