src/grid/column/Date.js

   1 /**
   2  * @class Ext.grid.column.Date
   3  * @extends Ext.grid.column.Column
   4  * <p>A Column definition class which renders a passed date according to the default locale, or a configured
   5  * {@link #format}.</p>
   6  *
   7  * {@img Ext.grid.column.Date/Ext.grid.column.Date.png Ext.grid.column.Date grid column}
   8  *
   9  * ## Code
  10  *    Ext.create('Ext.data.Store', {
  11  *        storeId:'sampleStore',
  12  *        fields:[
  13  *            {name: 'symbol', type: 'string'},
  14  *            {name: 'date', type: 'date'},
  15  *            {name: 'change', type: 'number'},
  16  *            {name: 'volume', type: 'number'},
  17  *            {name: 'topday', type: 'date'}
  18  *        ],
  19  *        data:[
  20  *            {symbol:"msft", date:'2011/04/22', change:2.43, volume:61606325, topday:'04/01/2010'},
  21  *            {symbol:"goog", date:'2011/04/22', change:0.81, volume:3053782, topday:'04/11/2010'},
  22  *            {symbol:"apple", date:'2011/04/22', change:1.35, volume:24484858, topday:'04/28/2010'},
  23  *            {symbol:"sencha", date:'2011/04/22', change:8.85, volume:5556351, topday:'04/22/2010'}
  24  *        ]
  25  *    });
  26  *
  27  *    Ext.create('Ext.grid.Panel', {
  28  *        title: 'Date Column Demo',
  29  *        store: Ext.data.StoreManager.lookup('sampleStore'),
  30  *        columns: [
  31  *            {text: 'Symbol',  dataIndex: 'symbol', flex: 1},
  32  *            {text: 'Date',  dataIndex: 'date', xtype: 'datecolumn', format:'Y-m-d'},
  33  *            {text: 'Change',  dataIndex: 'change', xtype: 'numbercolumn', format:'0.00'},
  34  *            {text: 'Volume',  dataIndex: 'volume', xtype: 'numbercolumn', format:'0,000'},
  35  *            {text: 'Top Day',  dataIndex: 'topday', xtype: 'datecolumn', format:'l'}
  36  *        ],
  37  *        height: 200,
  38  *        width: 450,
  39  *        renderTo: Ext.getBody()
  40  *    });
  41  *
  42  * @xtype datecolumn
  43  */
  44 Ext.define('Ext.grid.column.Date', {
  45     extend: 'Ext.grid.column.Column',
  46     alias: ['widget.datecolumn'],
  47     requires: ['Ext.Date'],
  48     alternateClassName: 'Ext.grid.DateColumn',
  49
  50     /**
  51      * @cfg {String} format
  52      * A formatting string as used by {@link Date#format Date.format} to format a Date for this Column.
  53      * This defaults to the default date from {@link Ext.Date#defaultFormat} which itself my be overridden
  54      * in a locale file.
  55      */
  56     format : Ext.Date.defaultFormat,
  57
  58     constructor: function(cfg){
  59         this.callParent(arguments);
  60         this.renderer = Ext.util.Format.dateRenderer(this.format);
  61     }
  62 });