2010-08-11 65 views
1

我有一個可操作的網格到網格的拖放配置,但是一旦我將其中一個網格更改爲EditorGridPanel,我就不能再從它拖拽它 - 只有它。有一次,我在該行點擊我想拖我得到以下錯誤:ExtJS - EditorGridPanel行不可拖動?

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

ext-all-debug.js (line 45439) 

有什麼辦法來設定,讓我可以從一個EditorGridPanel拖行?

回答

1

在查看另一個示例時無意中找到了答案。

當創建一個EditorGridPanel,一定要包括:

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

獲得拖放功能工作。

+0

任何機會,你可以發佈鏈接的例子你發現了什麼? – 2011-01-10 21:54:50

+0

確保它進入網格的viewConfig設置中,而不是直接在網格的配置設置中。 – 2012-12-18 22:51:25

1

您不必使用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; 
     } 
    }); 
}