docs/source/View.html

   1 <!DOCTYPE html><html><head><title>Sencha Documentation Project</title><link rel="stylesheet" href="../reset.css" type="text/css"><link rel="stylesheet" href="../prettify.css" type="text/css"><link rel="stylesheet" href="../prettify_sa.css" type="text/css"><script type="text/javascript" src="../prettify.js"></script></head><body onload="prettyPrint()"><pre class="prettyprint"><pre><span id='Ext-grid.View'>/**
   2 </span> * @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 <span id='Ext-grid.View-cfg-stripeRows'>    /**
  38 </span>     * @cfg {Boolean} stripeRows &lt;tt&gt;true&lt;/tt&gt; to stripe the rows. Default is &lt;tt&gt;false&lt;/tt&gt;.
  39      * &lt;p&gt;This causes the CSS class &lt;tt&gt;&lt;b&gt;x-grid-row-alt&lt;/b&gt;&lt;/tt&gt; 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 &lt;b&gt;background-color&lt;/b&gt; style using the '!important'
  42      * modifier, or which uses a CSS selector of higher specificity.&lt;/p&gt;
  43      */
  44     stripeRows: true,
  45
  46     invalidateScrollerOnRefresh: true,
  47
  48 <span id='Ext-grid.View-method-scrollToTop'>    /**
  49 </span>     * 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 <span id='Ext-grid.View-method-doStripeRows'>    /**
  76 </span>     * Stripe rows from a particular row index
  77      * @param {Number} startRow
  78      * @private
  79      */
  80     doStripeRows: function(startRow) {
  81         // ensure stripeRows configuration is turned on
  82         if (this.stripeRows) {
  83             var rows   = this.getNodes(startRow),
  84                 rowsLn = rows.length,
  85                 i      = 0,
  86                 row;
  87
  88             for (; i &lt; rowsLn; i++) {
  89                 row = rows[i];
  90                 // Remove prior applied row classes.
  91                 row.className = row.className.replace(this.rowClsRe, ' ');
  92                 // Every odd row will get an additional cls
  93                 if (i % 2 === 1) {
  94                     row.className += (' ' + this.altRowCls);
  95                 }
  96             }
  97         }
  98     },
  99
 100     refresh: function(firstPass) {
 101         this.callParent(arguments);
 102         this.doStripeRows(0);
 103         // TODO: Remove gridpanel dependency
 104         var g = this.up('gridpanel');
 105         if (g &amp;&amp; this.invalidateScrollerOnRefresh) {
 106             g.invalidateScroller();
 107         }
 108     }
 109 });
 110 </pre></pre></body></html>