extjs/build/examples/kitchensink/classic/samples/view/form/Date.js

   1 /**
   2  * This example shows how to use the date/month pickers.
   3  */
   4 Ext.define('KitchenSink.view.form.Date', {
   5     extend: 'Ext.container.Container',
   6     xtype: 'form-date',
   7
   8     //<example>
   9     requires: [
  10         'Ext.panel.Panel',
  11         'Ext.picker.Date',
  12         'Ext.picker.Month',
  13         'Ext.layout.container.VBox',
  14         'Ext.layout.container.HBox'
  15     ],
  16     exampleTitle: 'Date/Month Picking',
  17     profiles: {
  18         classic: {
  19             width: 400
  20         },
  21         neptune: {
  22             width: 465
  23         },
  24         'neptune-touch': {
  25             width: 600
  26         },
  27         'triton': {
  28             width: 750
  29         }
  30     },
  31     //</example>
  32
  33     layout: {
  34         type: 'vbox',
  35         align: 'center'
  36     },
  37
  38     width: 500,
  39
  40     items: [{
  41         xtype: 'container',
  42         layout: 'hbox',
  43         margin: '0 0 20 0',
  44         items: [{
  45             title: 'Date Picker',
  46             margin: '0 20 0 0',
  47             items: {
  48                 xtype: 'datepicker'
  49             }
  50         }, {
  51             title: 'Month Picker',
  52             items: {
  53                 xtype: 'monthpicker'
  54             }
  55         }]
  56     }, {
  57         xtype: 'container',
  58         layout: 'hbox',
  59         items: [{
  60             title: 'Date Picker (no today)',
  61             margin: '0 20 0 0',
  62             items: {
  63                 xtype: 'datepicker',
  64                 showToday: false
  65             }
  66         }, {
  67             title: 'Month Picker (no buttons)',
  68             items: {
  69                 xtype: 'monthpicker',
  70                 showButtons: false
  71             }
  72         }]
  73     }],
  74
  75     initComponent: function() {
  76         this.width = this.profileInfo.width;
  77
  78         this.callParent();
  79     }
  80 });