4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
5 <title>The source code</title>
6 <link href="../resources/prettify/prettify.css" type="text/css" rel="stylesheet" />
7 <script type="text/javascript" src="../resources/prettify/prettify.js"></script>
8 <style type="text/css">
9 .highlight { display: block; background-color: #ddd; }
11 <script type="text/javascript">
12 function highlight() {
13 document.getElementById(location.hash.replace(/#/, "")).className = "highlight";
17 <body onload="prettyPrint(); highlight();">
18 <pre class="prettyprint lang-js"><span id='Ext-grid-column-Date'>/**
19 </span> * A Column definition class which renders a passed date according to the default locale, or a configured
23 * Ext.create('Ext.data.Store', {
24 * storeId:'sampleStore',
26 * { name: 'symbol', type: 'string' },
27 * { name: 'date', type: 'date' },
28 * { name: 'change', type: 'number' },
29 * { name: 'volume', type: 'number' },
30 * { name: 'topday', type: 'date' }
33 * { symbol: "msft", date: '2011/04/22', change: 2.43, volume: 61606325, topday: '04/01/2010' },
34 * { symbol: "goog", date: '2011/04/22', change: 0.81, volume: 3053782, topday: '04/11/2010' },
35 * { symbol: "apple", date: '2011/04/22', change: 1.35, volume: 24484858, topday: '04/28/2010' },
36 * { symbol: "sencha", date: '2011/04/22', change: 8.85, volume: 5556351, topday: '04/22/2010' }
40 * Ext.create('Ext.grid.Panel', {
41 * title: 'Date Column Demo',
42 * store: Ext.data.StoreManager.lookup('sampleStore'),
44 * { text: 'Symbol', dataIndex: 'symbol', flex: 1 },
45 * { text: 'Date', dataIndex: 'date', xtype: 'datecolumn', format:'Y-m-d' },
46 * { text: 'Change', dataIndex: 'change', xtype: 'numbercolumn', format:'0.00' },
47 * { text: 'Volume', dataIndex: 'volume', xtype: 'numbercolumn', format:'0,000' },
48 * { text: 'Top Day', dataIndex: 'topday', xtype: 'datecolumn', format:'l' }
52 * renderTo: Ext.getBody()
55 Ext.define('Ext.grid.column.Date', {
56 extend: 'Ext.grid.column.Column',
57 alias: ['widget.datecolumn'],
58 requires: ['Ext.Date'],
59 alternateClassName: 'Ext.grid.DateColumn',
61 <span id='Ext-grid-column-Date-cfg-format'> /**
62 </span> * @cfg {String} format
63 * A formatting string as used by {@link Ext.Date#format} to format a Date for this Column.
64 * This defaults to the default date from {@link Ext.Date#defaultFormat} which itself my be overridden
68 initComponent: function(){
71 me.callParent(arguments);
73 me.format = Ext.Date.defaultFormat;
75 me.renderer = Ext.util.Format.dateRenderer(me.format);