docs/source/DateMenu.html

   1 <html>
   2 <head>
   3   <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
   4   <title>The source code</title>
   5     <link href="../resources/prettify/prettify.css" type="text/css" rel="stylesheet" />
   6     <script type="text/javascript" src="../resources/prettify/prettify.js"></script>
   7 </head>
   8 <body  onload="prettyPrint();">
   9     <pre class="prettyprint lang-js">/*!
  10  * Ext JS Library 3.2.1
  11  * Copyright(c) 2006-2010 Ext JS, Inc.
  12  * licensing@extjs.com
  13  * http://www.extjs.com/license
  14  */
  15 <div id="cls-Ext.menu.DateMenu"></div>/**
  16  * @class Ext.menu.DateMenu
  17  * @extends Ext.menu.Menu
  18  * <p>A menu containing an {@link Ext.DatePicker} Component.</p>
  19  * <p>Notes:</p><div class="mdetail-params"><ul>
  20  * <li>Although not listed here, the <b>constructor</b> for this class
  21  * accepts all of the configuration options of <b>{@link Ext.DatePicker}</b>.</li>
  22  * <li>If subclassing DateMenu, any configuration options for the DatePicker must be
  23  * applied to the <tt><b>initialConfig</b></tt> property of the DateMenu.
  24  * Applying {@link Ext.DatePicker DatePicker} configuration settings to
  25  * <b><tt>this</tt></b> will <b>not</b> affect the DatePicker's configuration.</li>
  26  * </ul></div>
  27  * @xtype datemenu
  28  */
  29  Ext.menu.DateMenu = Ext.extend(Ext.menu.Menu, {
  30     <div id="cfg-Ext.menu.DateMenu-enableScrolling"></div>/**
  31      * @cfg {Boolean} enableScrolling
  32      * @hide
  33      */
  34     enableScrolling : false,
  35     <div id="cfg-Ext.menu.DateMenu-handler"></div>/**
  36      * @cfg {Function} handler
  37      * Optional. A function that will handle the select event of this menu.
  38      * The handler is passed the following parameters:<div class="mdetail-params"><ul>
  39      * <li><code>picker</code> : DatePicker<div class="sub-desc">The Ext.DatePicker.</div></li>
  40      * <li><code>date</code> : Date<div class="sub-desc">The selected date.</div></li>
  41      * </ul></div>
  42      */
  43     <div id="cfg-Ext.menu.DateMenu-scope"></div>/**
  44      * @cfg {Object} scope
  45      * The scope (<tt><b>this</b></tt> reference) in which the <code>{@link #handler}</code>
  46      * function will be called.  Defaults to this DateMenu instance.
  47      */
  48     <div id="cfg-Ext.menu.DateMenu-hideOnClick"></div>/**
  49      * @cfg {Boolean} hideOnClick
  50      * False to continue showing the menu after a date is selected, defaults to true.
  51      */
  52     hideOnClick : true,
  53
  54     <div id="cfg-Ext.menu.DateMenu-pickerId"></div>/**
  55      * @cfg {String} pickerId
  56      * An id to assign to the underlying date picker. Defaults to <tt>null</tt>.
  57      */
  58     pickerId : null,
  59
  60     <div id="cfg-Ext.menu.DateMenu-maxHeight"></div>/**
  61      * @cfg {Number} maxHeight
  62      * @hide
  63      */
  64     <div id="cfg-Ext.menu.DateMenu-scrollIncrement"></div>/**
  65      * @cfg {Number} scrollIncrement
  66      * @hide
  67      */
  68     <div id="prop-Ext.menu.DateMenu-picker"></div>/**
  69      * The {@link Ext.DatePicker} instance for this DateMenu
  70      * @property picker
  71      * @type DatePicker
  72      */
  73     cls : 'x-date-menu',
  74
  75     <div id="event-Ext.menu.DateMenu-click"></div>/**
  76      * @event click
  77      * @hide
  78      */
  79
  80     <div id="event-Ext.menu.DateMenu-itemclick"></div>/**
  81      * @event itemclick
  82      * @hide
  83      */
  84
  85     initComponent : function(){
  86         this.on('beforeshow', this.onBeforeShow, this);
  87         if(this.strict = (Ext.isIE7 && Ext.isStrict)){
  88             this.on('show', this.onShow, this, {single: true, delay: 20});
  89         }
  90         Ext.apply(this, {
  91             plain: true,
  92             showSeparator: false,
  93             items: this.picker = new Ext.DatePicker(Ext.applyIf({
  94                 internalRender: this.strict || !Ext.isIE,
  95                 ctCls: 'x-menu-date-item',
  96                 id: this.pickerId
  97             }, this.initialConfig))
  98         });
  99         this.picker.purgeListeners();
 100         Ext.menu.DateMenu.superclass.initComponent.call(this);
 101         <div id="event-Ext.menu.DateMenu-select"></div>/**
 102          * @event select
 103          * Fires when a date is selected from the {@link #picker Ext.DatePicker}
 104          * @param {DatePicker} picker The {@link #picker Ext.DatePicker}
 105          * @param {Date} date The selected date
 106          */
 107         this.relayEvents(this.picker, ['select']);
 108         this.on('show', this.picker.focus, this.picker);
 109         this.on('select', this.menuHide, this);
 110         if(this.handler){
 111             this.on('select', this.handler, this.scope || this);
 112         }
 113     },
 114
 115     menuHide : function() {
 116         if(this.hideOnClick){
 117             this.hide(true);
 118         }
 119     },
 120
 121     onBeforeShow : function(){
 122         if(this.picker){
 123             this.picker.hideMonthPicker(true);
 124         }
 125     },
 126
 127     onShow : function(){
 128         var el = this.picker.getEl();
 129         el.setWidth(el.getWidth()); //nasty hack for IE7 strict mode
 130     }
 131  });
 132  Ext.reg('datemenu', Ext.menu.DateMenu);
 133  </pre>
 134 </body>
 135 </html>