解决grid拖拽功能后,复选框多选后取消不掉的问题

本文主要是介绍解决grid拖拽功能后,复选框多选后取消不掉的问题，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

        Extjs 中设置enableDragDrop:true,即可实现grdi的grid可拖拽功能，但是与此同时带来一个bug,复选框多选后,点击其中的一个复选框取消不掉已选中的这行
只能通过全选然后取消。我们希望是通过复选框选中多行记录时，可以通过点击复选框取消刚选择的若干行记录。
      这个问题也是extjs自身的一个bug,就是CheckboxSelectionModel和拖拽功能（enableDragDrop:true）是冲突的,通过谷歌找到解决方案。通过重写GridDragZone的getDragData方法去实现

new Ext.grid.EditorGridPanel({header: false,region: 'west',width: 700,border: false,enableColumnMove: false,enableHdMenu: false,store: this.store,selModel:sm,columns: this.columns,multiSelect : true,enableDragDrop:true,//设置拖拽功能ddGroup: 'gridDD', dropConfig: {appendOnly:false},loadMask: {msg:'<fmt:message key="mainPanel.loading"/>'},listeners: {render: function(grid){var ddrow = new Ext.dd.DropTarget(grid.getEl(), {ddGroup: 'gridDD',copy    : false,notifyDrop : function(dd, e, data){var rows = grid.getSelectionModel().getSelections();var count = rows.length;var dropIndex = dd.getDragData(e).rowIndex;if (!dropIndex && dropIndex != 0) return ;grid.getStore().remove(rows);grid.getView().refresh();var dropIndex2 = dd.getDragData(e).rowIndex;var array=[];if (dropIndex != dropIndex2) dropIndex = dropIndex2 + 1 ;for(var i=0;i < count;i++){var index = dropIndex + i;array.push(index);}grid.getStore().insert(dropIndex,data.selections);grid.getSelectionModel().selectRows(array);grid.getView().refresh();}});}}});

解决方法：重写GridDragZone的getDragData方法

     

	 Ext.override( Ext.grid.GridDragZone, {getDragData : function( e ) {var t = Ext.lib.Event.getTarget(e);var rowIndex = this.view.findRowIndex(t);if ( rowIndex !== false ) {var sm = this.grid.selModel;if ( sm instanceof( Ext.grid.CheckboxSelectionModel ) ) {sm.onMouseDown( e, t );}if( t.className != 'x-grid3-row-checker' && ( !sm.isSelected( rowIndex ) || e.hasModifier() ) ) {sm.handleMouseDown( this.grid, rowIndex, e );}return { grid: this.grid, ddel: this.ddel, rowIndex: rowIndex, selections:sm.getSelections() };}return false;}} ); 

这篇关于解决grid拖拽功能后,复选框多选后取消不掉的问题的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！

---