X-Git-Url: http://git.ithinksw.org/extjs.git/blobdiff_plain/0494b8d9b9bb03ab6c22b34dae81261e3cd7e3e6..7a654f8d43fdb43d78b63d90528bed6e86b608cc:/src/menu/DatePicker.js?ds=sidebyside diff --git a/src/menu/DatePicker.js b/src/menu/DatePicker.js new file mode 100644 index 00000000..192395f3 --- /dev/null +++ b/src/menu/DatePicker.js @@ -0,0 +1,115 @@ +/** + * @class Ext.menu.DatePicker + * @extends Ext.menu.Menu + *

A menu containing an {@link Ext.picker.Date} Component.

+ *

Notes:

+ * {@img Ext.menu.DatePicker/Ext.menu.DatePicker.png Ext.menu.DatePicker component} + * __Example Usage__ + var dateMenu = Ext.create('Ext.menu.DatePicker', { + handler: function(dp, date){ + Ext.Msg.alert('Date Selected', 'You choose {0}.', Ext.Date.format(date, 'M j, Y')); + + } + }); + + Ext.create('Ext.menu.Menu', { + width: 100, + height: 90, + floating: false, // usually you want this set to True (default) + renderTo: Ext.getBody(), // usually rendered by it's containing component + items: [{ + text: 'choose a date', + menu: dateMenu + },{ + iconCls: 'add16', + text: 'icon item' + },{ + text: 'regular item' + }] + }); + + * @xtype datemenu + * @author Nicolas Ferrero + */ + Ext.define('Ext.menu.DatePicker', { + extend: 'Ext.menu.Menu', + + alias: 'widget.datemenu', + + requires: [ + 'Ext.picker.Date' + ], + + /** + * @cfg {Boolean} hideOnClick + * False to continue showing the menu after a date is selected, defaults to true. + */ + hideOnClick : true, + + /** + * @cfg {String} pickerId + * An id to assign to the underlying date picker. Defaults to null. + */ + pickerId : null, + + /** + * @cfg {Number} maxHeight + * @hide + */ + + /** + * The {@link Ext.picker.Date} instance for this DateMenu + * @property picker + * @type Ext.picker.Date + */ + + /** + * @event click + * @hide + */ + + /** + * @event itemclick + * @hide + */ + + initComponent : function(){ + var me = this; + + Ext.apply(me, { + showSeparator: false, + plain: true, + items: Ext.applyIf({ + cls: Ext.baseCSSPrefix + 'menu-date-item', + id: me.pickerId, + xtype: 'datepicker' + }, me.initialConfig) + }); + + me.callParent(arguments); + + me.picker = me.down('datepicker'); + /** + * @event select + * Fires when a date is selected from the {@link #picker Ext.picker.Date} + * @param {Ext.picker.Date} picker The {@link #picker Ext.picker.Date} + * @param {Date} date The selected date + */ + me.relayEvents(me.picker, ['select']); + + if (me.hideOnClick) { + me.on('select', me.hidePickerOnSelect, me); + } + }, + + hidePickerOnSelect: function() { + Ext.menu.Manager.hideAll(); + } + }); \ No newline at end of file