EXTjs 4 выясняет происхождение и место назначения для событий плагина перетаскивания - PullRequest
Новая
       11

EXTjs 4 выясняет происхождение и место назначения для событий плагина перетаскивания

2 голосов
/ 07 июля 2011

Я учу себя 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, но поскольку я хочу, чтобы элементы плавно перетаскивали друг друга, я дал группам одно и то же имя.

Shows 3 of the 4 grids and how the items could be moved from grid to grid

Способ, которым информация первоначально вводится в 4 различных списка, заключается в просмотре значения state_id в БД. Все state_ids 1 отправляются в хранилище невыполненных работ, 2 в хранилище Ingress и т. Д. И т. Д.

Итак, что мне нужно сделать, когда элемент перетаскивается, это удалить его из старого хранилища и поместить в новое хранилище (одновременно обновляя state_id, чтобы впоследствии я мог синхронизировать его с БД) .

Моя единственная проблема - определить исходную и целевую сетки строки, которая была перемещена.

Спасибо!

PS. Если вам интересно, вот как выглядит мой обработчик события 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);
},

Как видите, я не очень далеко ушел ^ _ ^

1 Ответ

0 голосов
/ 08 июля 2011

Хорошо, я нашел способ сделать это, который кажется менее идеальным ... но он работает так, пока кто-то не найдет лучшее решение, я застряну, делая это так: 

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 для строки, которая была перемещена, а затем, наконец, я вызываю функцию синхронизации, чтобы обновить базу данных с новой информацией о строке.

...