EXTjs 4 找出拖放插件事件的起点和终点

Question

我正在通过构建一个非常简单的应用程序自学 EXTjs 4。

在 EXTjs 4 中，我有 4 个网格，每个网格都有 Grid to Grid 拖放插件。 （此处的示例功能：http://dev.sencha.com/deploy/ext-4.0.2a/examples/dd/dnd_grid_to_grid.html）

在我看来，我的插件是这样定义的：

viewConfig: {
    plugins: {
        ptype: 'gridviewdragdrop',
        dragGroup: 'ddzone',
        dropGroup: 'ddzone'
    }
},

现在在示例中，它们有不同的 dragGroups 和 dropGroups，但因为我希望项目能够流畅地在彼此之间拖放，所以我给了这些组相同的名称。

最初将信息填充到 4 个不同列表中的方式是查看数据库中的 state_id。所有 state_ids 1 进入 backlog 存储，2 In Progress 存储，等等。

所以当项目被拖放时，我需要做的是将它从旧存储中删除并将其放入新存储中（同时更新 state_id，以便之后我可以将其与数据库同步） .

我唯一的问题是找出被移动的行的原始网格和目标网格。

谢谢！

附言。如果你好奇，这就是我的 drop 事件处理程序目前的样子：

dropit: function (node, data, dropRec, dropPosition) {
    console.log('this');
    console.log(this);
    console.log('node');
    console.log(node);
    console.log('data');
    console.log(data);
    console.log('droprec');
    console.log(dropRec);
    console.log('dropPosition');
    console.log(dropPosition);
},

如你所见，我还没有走多远^_^

Answer 1

好吧，我想出了一种似乎不太理想的方法......但它确实有效，所以在有人提供更好的解决方案之前，我会一直这样做：

dropit: function (node, data, dropRec, dropPosition) {
    if (node.dragData.records[0].store.$className == "AM.store.BacklogCards")
    {
        data.records[0].set('state_id', 1);
        this.getBacklogCardsStore().sync();
    }
    else if (node.dragData.records[0].store.$className == "AM.store.InprogressCards")
    {
        data.records[0].set('state_id', 2);
        this.getInprogressCardsStore().sync();
    }
    else if (node.dragData.records[0].store.$className == "AM.store.ReviewCards")
    {
        data.records[0].set('state_id', 3);
        this.getReviewCardsStore().sync();
    }
    else
    {
        data.records[0].set('state_id', 4);
        this.getDoneCardsStore().sync();
    }

我注意到 node.dragData.records[0].store.$className 指向定义的存储，这是网格自身的基础。

使用 data.records[0].set('state_id', 1);为被移动的行设置 state_id，最后，我调用同步函数用新的行信息更新数据库。