GridDD.js
上传用户:shuoshiled
上传日期:2018-01-28
资源大小:10124k
文件大小:4k
源码类别:

中间件编程

开发平台:

JavaScript

  1. /*!
  2.  * Ext JS Library 3.0.0
  3.  * Copyright(c) 2006-2009 Ext JS, LLC
  4.  * licensing@extjs.com
  5.  * http://www.extjs.com/license
  6.  */
  7. /**
  8.  * @class Ext.grid.GridDragZone
  9.  * @extends Ext.dd.DragZone
  10.  * <p>A customized implementation of a {@link Ext.dd.DragZone DragZone} which provides default implementations of two of the
  11.  * template methods of DragZone to enable dragging of the selected rows of a GridPanel.</p>
  12.  * <p>A cooperating {@link Ext.dd.DropZone DropZone} must be created who's template method implementations of
  13.  * {@link Ext.dd.DropZone#onNodeEnter onNodeEnter}, {@link Ext.dd.DropZone#onNodeOver onNodeOver},
  14.  * {@link Ext.dd.DropZone#onNodeOut onNodeOut} and {@link Ext.dd.DropZone#onNodeDrop onNodeDrop}</p> are able
  15.  * to process the {@link #getDragData data} which is provided.
  16.  */
  17. Ext.grid.GridDragZone = function(grid, config){
  18.     this.view = grid.getView();
  19.     Ext.grid.GridDragZone.superclass.constructor.call(this, this.view.mainBody.dom, config);
  20.     this.scroll = false;
  21.     this.grid = grid;
  22.     this.ddel = document.createElement('div');
  23.     this.ddel.className = 'x-grid-dd-wrap';
  24. };
  25. Ext.extend(Ext.grid.GridDragZone, Ext.dd.DragZone, {
  26.     ddGroup : "GridDD",
  27.     /**
  28.      * <p>The provided implementation of the getDragData method which collects the data to be dragged from the GridPanel on mousedown.</p>
  29.      * <p>This data is available for processing in the {@link Ext.dd.DropZone#onNodeEnter onNodeEnter}, {@link Ext.dd.DropZone#onNodeOver onNodeOver},
  30.      * {@link Ext.dd.DropZone#onNodeOut onNodeOut} and {@link Ext.dd.DropZone#onNodeDrop onNodeDrop} methods of a cooperating {@link Ext.dd.DropZone DropZone}.</p>
  31.      * <p>The data object contains the following properties:<ul>
  32.      * <li><b>grid</b> : Ext.Grid.GridPanel<div class="sub-desc">The GridPanel from which the data is being dragged.</div></li>
  33.      * <li><b>ddel</b> : htmlElement<div class="sub-desc">An htmlElement which provides the "picture" of the data being dragged.</div></li>
  34.      * <li><b>rowIndex</b> : Number<div class="sub-desc">The index of the row which receieved the mousedown gesture which triggered the drag.</div></li>
  35.      * <li><b>selections</b> : Array<div class="sub-desc">An Array of the selected Records which are being dragged from the GridPanel.</div></li>
  36.      * </ul></p>
  37.      */
  38.     getDragData : function(e){
  39.         var t = Ext.lib.Event.getTarget(e);
  40.         var rowIndex = this.view.findRowIndex(t);
  41.         if(rowIndex !== false){
  42.             var sm = this.grid.selModel;
  43.             if(!sm.isSelected(rowIndex) || e.hasModifier()){
  44.                 sm.handleMouseDown(this.grid, rowIndex, e);
  45.             }
  46.             return {grid: this.grid, ddel: this.ddel, rowIndex: rowIndex, selections:sm.getSelections()};
  47.         }
  48.         return false;
  49.     },
  50.     /**
  51.      * <p>The provided implementation of the onInitDrag method. Sets the <tt>innerHTML</tt> of the drag proxy which provides the "picture"
  52.      * of the data being dragged.</p>
  53.      * <p>The <tt>innerHTML</tt> data is found by calling the owning GridPanel's {@link Ext.grid.GridPanel#getDragDropText getDragDropText}.</p>
  54.      */
  55.     onInitDrag : function(e){
  56.         var data = this.dragData;
  57.         this.ddel.innerHTML = this.grid.getDragDropText();
  58.         this.proxy.update(this.ddel);
  59.         // fire start drag?
  60.     },
  61.     /**
  62.      * An empty immplementation. Implement this to provide behaviour after a repair of an invalid drop. An implementation might highlight
  63.      * the selected rows to show that they have not been dragged.
  64.      */
  65.     afterRepair : function(){
  66.         this.dragging = false;
  67.     },
  68.     /**
  69.      * <p>An empty implementation. Implement this to provide coordinates for the drag proxy to slide back to after an invalid drop.</p>
  70.      * <p>Called before a repair of an invalid drop to get the XY to animate to.</p>
  71.      * @param {EventObject} e The mouse up event
  72.      * @return {Array} The xy location (e.g. [100, 200])
  73.      */
  74.     getRepairXY : function(e, data){
  75.         return false;
  76.     },
  77.     onEndDrag : function(data, e){
  78.         // fire end drag?
  79.     },
  80.     onValidDrop : function(dd, e, id){
  81.         // fire drag drop?
  82.         this.hideProxy();
  83.     },
  84.     beforeInvalidDrop : function(e, id){
  85.     }
  86. });