src/grid/View.js

   1 /**
   2  * @class Ext.grid.View
   3  * @extends Ext.view.Table
   4
   5 The grid View class provides extra {@link Ext.grid.Panel} specific functionality to the
   6 {@link Ext.view.Table}. In general, this class is not instanced directly, instead a viewConfig
   7 option is passed to the grid:
   8
   9     Ext.create('Ext.grid.Panel', {
  10         // other options
  11         viewConfig: {
  12             stripeRows: false
  13         }
  14     });
  15
  16 __Drag Drop__
  17 Drag and drop functionality can be achieved in the grid by attaching a {@link Ext.grid.plugin.DragDrop} plugin
  18 when creating the view.
  19
  20     Ext.create('Ext.grid.Panel', {
  21         // other options
  22         viewConfig: {
  23             plugins: {
  24                 ddGroup: 'people-group',
  25                 ptype: 'gridviewdragdrop',
  26                 enableDrop: false
  27             }
  28         }
  29     });
  30
  31  * @markdown
  32  */
  33 Ext.define('Ext.grid.View', {
  34     extend: 'Ext.view.Table',
  35     alias: 'widget.gridview',
  36
  37     /**
  38      * @cfg {Boolean} stripeRows <tt>true</tt> to stripe the rows. Default is <tt>false</tt>.
  39      * <p>This causes the CSS class <tt><b>x-grid-row-alt</b></tt> to be added to alternate rows of
  40      * the grid. A default CSS rule is provided which sets a background color, but you can override this
  41      * with a rule which either overrides the <b>background-color</b> style using the '!important'
  42      * modifier, or which uses a CSS selector of higher specificity.</p>
  43      */
  44     stripeRows: true,
  45
  46     invalidateScrollerOnRefresh: true,
  47
  48     /**
  49      * Scroll the GridView to the top by scrolling the scroller.
  50      * @private
  51      */
  52     scrollToTop : function(){
  53         if (this.rendered) {
  54             var section = this.ownerCt,
  55                 verticalScroller = section.verticalScroller;
  56
  57             if (verticalScroller) {
  58                 verticalScroller.scrollToTop();
  59             }
  60         }
  61     },
  62
  63     // after adding a row stripe rows from then on
  64     onAdd: function(ds, records, index) {
  65         this.callParent(arguments);
  66         this.doStripeRows(index);
  67     },
  68
  69     // after removing a row stripe rows from then on
  70     onRemove: function(ds, records, index) {
  71         this.callParent(arguments);
  72         this.doStripeRows(index);
  73     },
  74
  75     onUpdate: function(ds, record, operation) {
  76         var index = ds.indexOf(record);
  77         this.callParent(arguments);
  78         this.doStripeRows(index, index);
  79     },
  80
  81     /**
  82      * Stripe rows from a particular row index
  83      * @param {Number} startRow
  84      * @param {Number} endRow Optional argument specifying the last row to process. By default process up to the last row.
  85      * @private
  86      */
  87     doStripeRows: function(startRow, endRow) {
  88         // ensure stripeRows configuration is turned on
  89         if (this.stripeRows) {
  90             var rows   = this.getNodes(startRow, endRow),
  91                 rowsLn = rows.length,
  92                 i      = 0,
  93                 row;
  94
  95             for (; i < rowsLn; i++) {
  96                 row = rows[i];
  97                 // Remove prior applied row classes.
  98                 row.className = row.className.replace(this.rowClsRe, ' ');
  99                 startRow++;
 100                 // Every odd row will get an additional cls
 101                 if (startRow % 2 === 0) {
 102                     row.className += (' ' + this.altRowCls);
 103                 }
 104             }
 105         }
 106     },
 107
 108     refresh: function(firstPass) {
 109         this.callParent(arguments);
 110         this.doStripeRows(0);
 111         // TODO: Remove gridpanel dependency
 112         var g = this.up('gridpanel');
 113         if (g && this.invalidateScrollerOnRefresh) {
 114             g.invalidateScroller();
 115         }
 116     }
 117 });