ExtJS - строки EditorGridPanel не перетаскиваются?

Question

У меня была рабочая конфигурация перетаскивания из сетки в сетку, но как только я изменил одну из сеток на EditorGridPanel, я больше не мог перетаскивать из нее - только в нее. Как только я нажимаю на строку, которую я хочу перетащить, я получаю следующую ошибку:

sm.isSelected is not a function
if(!sm.isSelected(rowIndex) || e.hasModifier()){

ext-all-debug.js (line 45439)

Есть ли способ настроить его так, чтобы я мог перетаскивать строки из EditorGridPanel?

Answer 1

Нашел ответ на это непреднамеренно, глядя на другой пример.

При создании EditorGridPanel обязательно включите:

selModel:new Ext.grid.RowSelectionModel({singleSelect:true}),

, чтобы работала функция перетаскивания.

Answer 2

Вам не нужно использовать RowSelectionModel, но вам придется написать собственный код для зон перетаскивания. Вот пример того, как использовать перетаскивание с CellSelectionModel:

grid1.on('render', function(grid) {grid1.initializeDragZone (grid1); }); grid2.on('render', function(grid) {grid2.initializeDropZone (grid2); });

initializeDragZone : function(grid) {
    grid.dragZone = new Ext.dd.DragZone(grid.getEl(), {
        getRepairXY: function() {
            return this.dragData.repairXY;
        },

        getDragData: function(e) {
            var cell = grid.getSelectionModel().getSelectedCell();
            var row = grid.getStore().getAt(cell[0]);
            var data = row.get('id');     //you can put custom data here
            var sourceEl = grid.getView().getRow(cell[0]);

            if (sourceEl) {
                var d = sourceEl.cloneNode(true);
                d.id = Ext.id();
                return grid.dragData = {
                    sourceEl: sourceEl,
                    repairXY: Ext.fly(sourceEl).getXY(),
                    ddel: d,
                    customData: data  //our custom data
                };
            }
        }
    });
}

initializeDropZone : function(grid) {
    grid.dropZone = new Ext.dd.DropZone(grid.getView().scroller, {
        getTargetFromEvent: function(e) { //supports multiple drop zone classes
            var target = e.getTarget('.some-class1');  
            target = target? target: e.getTarget('.some-class2');
            target = target? target: e.getTarget('.some-class3');
            target = target? target: e.getTarget('.some-class4');
            return target;
        },

        onNodeEnter : function(target, dd, e, data){ 
            Ext.fly(target).addClass('drop-zone-selected'); //test
        },

        onNodeOut : function(target, dd, e, data){ 
            Ext.fly(target).removeClass('drop-zone-selected');  //test
        },

        onNodeOver : function(target, dd, e, data){ 
            return Ext.dd.DropZone.prototype.dropAllowed;
        },

        onNodeDrop : function(target, dd, e, data){
            var rowIndex = grid.getView().findRowIndex(target);
            var rowRecord = grid.getStore().getAt(rowIndex);
            var customData = data.customData;

            //use custom data

            return true;
        }
    });
}