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

中间件编程

开发平台:

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.CellSelectionModel
  9.  * @extends Ext.grid.AbstractSelectionModel
  10.  * This class provides the basic implementation for <i>single</i> <b>cell</b> selection in a grid.
  11.  * The object stored as the selection contains the following properties:
  12.  * <div class="mdetail-params"><ul>
  13.  * <li><b>cell</b> : see {@link #getSelectedCell} 
  14.  * <li><b>record</b> : Ext.data.record The {@link Ext.data.Record Record}
  15.  * which provides the data for the row containing the selection</li>
  16.  * </ul></div>
  17.  * @constructor
  18.  * @param {Object} config The object containing the configuration of this model.
  19.  */
  20. Ext.grid.CellSelectionModel = function(config){
  21.     Ext.apply(this, config);
  22.     this.selection = null;
  23.     this.addEvents(
  24.         /**
  25.      * @event beforecellselect
  26.      * Fires before a cell is selected, return false to cancel the selection.
  27.      * @param {SelectionModel} this
  28.      * @param {Number} rowIndex The selected row index
  29.      * @param {Number} colIndex The selected cell index
  30.      */
  31.     "beforecellselect",
  32.         /**
  33.      * @event cellselect
  34.      * Fires when a cell is selected.
  35.      * @param {SelectionModel} this
  36.      * @param {Number} rowIndex The selected row index
  37.      * @param {Number} colIndex The selected cell index
  38.      */
  39.     "cellselect",
  40.         /**
  41.      * @event selectionchange
  42.      * Fires when the active selection changes.
  43.      * @param {SelectionModel} this
  44.      * @param {Object} selection null for no selection or an object with two properties
  45.          * <div class="mdetail-params"><ul>
  46.          * <li><b>cell</b> : see {@link #getSelectedCell} 
  47.          * <li><b>record</b> : Ext.data.record<p class="sub-desc">The {@link Ext.data.Record Record}
  48.          * which provides the data for the row containing the selection</p></li>
  49.          * </ul></div>
  50.      */
  51.     "selectionchange"
  52.     );
  53.     Ext.grid.CellSelectionModel.superclass.constructor.call(this);
  54. };
  55. Ext.extend(Ext.grid.CellSelectionModel, Ext.grid.AbstractSelectionModel,  {
  56.     /** @ignore */
  57.     initEvents : function(){
  58.         this.grid.on("cellmousedown", this.handleMouseDown, this);
  59.         this.grid.getGridEl().on(Ext.EventManager.useKeydown ? "keydown" : "keypress", this.handleKeyDown, this);
  60.         var view = this.grid.view;
  61.         view.on("refresh", this.onViewChange, this);
  62.         view.on("rowupdated", this.onRowUpdated, this);
  63.         view.on("beforerowremoved", this.clearSelections, this);
  64.         view.on("beforerowsinserted", this.clearSelections, this);
  65.         if(this.grid.isEditor){
  66.             this.grid.on("beforeedit", this.beforeEdit,  this);
  67.         }
  68.     },
  69. //private
  70.     beforeEdit : function(e){
  71.         this.select(e.row, e.column, false, true, e.record);
  72.     },
  73. //private
  74.     onRowUpdated : function(v, index, r){
  75.         if(this.selection && this.selection.record == r){
  76.             v.onCellSelect(index, this.selection.cell[1]);
  77.         }
  78.     },
  79. //private
  80.     onViewChange : function(){
  81.         this.clearSelections(true);
  82.     },
  83. /**
  84.      * Returns an array containing the row and column indexes of the currently selected cell
  85.      * (e.g., [0, 0]), or null if none selected. The array has elements:
  86.      * <div class="mdetail-params"><ul>
  87.      * <li><b>rowIndex</b> : Number<p class="sub-desc">The index of the selected row</p></li>
  88.      * <li><b>cellIndex</b> : Number<p class="sub-desc">The index of the selected cell. 
  89.      * Due to possible column reordering, the cellIndex should <b>not</b> be used as an
  90.      * index into the Record's data. Instead, use the cellIndex to determine the <i>name</i>
  91.      * of the selected cell and use the field name to retrieve the data value from the record:<pre><code>
  92. // get name
  93. var fieldName = grid.getColumnModel().getDataIndex(cellIndex);
  94. // get data value based on name
  95. var data = record.get(fieldName);
  96.      * </code></pre></p></li>
  97.      * </ul></div>
  98.      * @return {Array} An array containing the row and column indexes of the selected cell, or null if none selected.
  99.  */
  100.     getSelectedCell : function(){
  101.         return this.selection ? this.selection.cell : null;
  102.     },
  103.     /**
  104.      * If anything is selected, clears all selections and fires the selectionchange event.
  105.      * @param {Boolean} preventNotify <tt>true</tt> to prevent the gridview from
  106.      * being notified about the change.
  107.      */
  108.     clearSelections : function(preventNotify){
  109.         var s = this.selection;
  110.         if(s){
  111.             if(preventNotify !== true){
  112.                 this.grid.view.onCellDeselect(s.cell[0], s.cell[1]);
  113.             }
  114.             this.selection = null;
  115.             this.fireEvent("selectionchange", this, null);
  116.         }
  117.     },
  118.     /**
  119.      * Returns <tt>true</tt> if there is a selection.
  120.      * @return {Boolean}
  121.      */
  122.     hasSelection : function(){
  123.         return this.selection ? true : false;
  124.     },
  125.     /** @ignore */
  126.     handleMouseDown : function(g, row, cell, e){
  127.         if(e.button !== 0 || this.isLocked()){
  128.             return;
  129.         }
  130.         this.select(row, cell);
  131.     },
  132.     /**
  133.      * Selects a cell.  Before selecting a cell, fires the
  134.      * {@link #beforecellselect} event.  If this check is satisfied the cell
  135.      * will be selected and followed up by  firing the {@link #cellselect} and
  136.      * {@link #selectionchange} events.
  137.      * @param {Number} rowIndex The index of the row to select
  138.      * @param {Number} colIndex The index of the column to select
  139.      * @param {Boolean} preventViewNotify (optional) Specify <tt>true</tt> to
  140.      * prevent notifying the view (disables updating the selected appearance)
  141.      * @param {Boolean} preventFocus (optional) Whether to prevent the cell at
  142.      * the specified rowIndex / colIndex from being focused.
  143.      * @param {Ext.data.Record} r (optional) The record to select
  144.      */
  145.     select : function(rowIndex, colIndex, preventViewNotify, preventFocus, /*internal*/ r){
  146.         if(this.fireEvent("beforecellselect", this, rowIndex, colIndex) !== false){
  147.             this.clearSelections();
  148.             r = r || this.grid.store.getAt(rowIndex);
  149.             this.selection = {
  150.                 record : r,
  151.                 cell : [rowIndex, colIndex]
  152.             };
  153.             if(!preventViewNotify){
  154.                 var v = this.grid.getView();
  155.                 v.onCellSelect(rowIndex, colIndex);
  156.                 if(preventFocus !== true){
  157.                     v.focusCell(rowIndex, colIndex);
  158.                 }
  159.             }
  160.             this.fireEvent("cellselect", this, rowIndex, colIndex);
  161.             this.fireEvent("selectionchange", this, this.selection);
  162.         }
  163.     },
  164. //private
  165.     isSelectable : function(rowIndex, colIndex, cm){
  166.         return !cm.isHidden(colIndex);
  167.     },
  168.     /** @ignore */
  169.     handleKeyDown : function(e){
  170.         if(!e.isNavKeyPress()){
  171.             return;
  172.         }
  173.         var g = this.grid, s = this.selection;
  174.         if(!s){
  175.             e.stopEvent();
  176.             var cell = g.walkCells(0, 0, 1, this.isSelectable,  this);
  177.             if(cell){
  178.                 this.select(cell[0], cell[1]);
  179.             }
  180.             return;
  181.         }
  182.         var sm = this;
  183.         var walk = function(row, col, step){
  184.             return g.walkCells(row, col, step, sm.isSelectable,  sm);
  185.         };
  186.         var k = e.getKey(), r = s.cell[0], c = s.cell[1];
  187.         var newCell;
  188.         switch(k){
  189.              case e.TAB:
  190.                  if(e.shiftKey){
  191.                      newCell = walk(r, c-1, -1);
  192.                  }else{
  193.                      newCell = walk(r, c+1, 1);
  194.                  }
  195.              break;
  196.              case e.DOWN:
  197.                  newCell = walk(r+1, c, 1);
  198.              break;
  199.              case e.UP:
  200.                  newCell = walk(r-1, c, -1);
  201.              break;
  202.              case e.RIGHT:
  203.                  newCell = walk(r, c+1, 1);
  204.              break;
  205.              case e.LEFT:
  206.                  newCell = walk(r, c-1, -1);
  207.              break;
  208.              case e.ENTER:
  209.                  if(g.isEditor && !g.editing){
  210.                     g.startEditing(r, c);
  211.                     e.stopEvent();
  212.                     return;
  213.                 }
  214.              break;
  215.         }
  216.         if(newCell){
  217.             this.select(newCell[0], newCell[1]);
  218.             e.stopEvent();
  219.         }
  220.     },
  221.     acceptsNav : function(row, col, cm){
  222.         return !cm.isHidden(col) && cm.isCellEditable(col, row);
  223.     },
  224.     onEditorKey : function(field, e){
  225.         var k = e.getKey(), newCell, g = this.grid, ed = g.activeEditor;
  226.         if(k == e.TAB){
  227.             if(e.shiftKey){
  228.                 newCell = g.walkCells(ed.row, ed.col-1, -1, this.acceptsNav, this);
  229.             }else{
  230.                 newCell = g.walkCells(ed.row, ed.col+1, 1, this.acceptsNav, this);
  231.             }
  232.             e.stopEvent();
  233.         }else if(k == e.ENTER){
  234.             ed.completeEdit();
  235.             e.stopEvent();
  236.         }else if(k == e.ESC){
  237.          e.stopEvent();
  238.             ed.cancelEdit();
  239.         }
  240.         if(newCell){
  241.             g.startEditing(newCell[0], newCell[1]);
  242.         }
  243.     }
  244. });