/* * GxUI Library 2.0.1 * Copyright (c) 2009, Artech * All rights reserved. * * GxUI Library is freely distributable under the terms of the BSD license. * */ /** * @class Ext.ux.form.field.DateTime * @extends Ext.form.FieldContainer * @version 0.2 (July 20th, 2011) * @author atian25 (http://www.sencha.com/forum/member.php?51682-atian25) * @author ontho (http://www.sencha.com/forum/member.php?285806-ontho) * @author jakob.ketterl (http://www.sencha.com/forum/member.php?25102-jakob.ketterl) * @link http://www.sencha.com/forum/showthread.php?134345-Ext.ux.form.field.DateTime * @ignore */ Ext.define('Ext.ux.form.field.DateTime', { extend: 'Ext.form.FieldContainer', mixins: { field: 'Ext.form.field.Field' }, alias: 'widget.xdatetime', //configurables combineErrors: true, msgTarget: 'under', layout: 'hbox', readOnly: false, /** * @cfg {String} dateFormat * Convenience config for specifying the format of the date portion. * This value is overridden if format is specified in the dateConfig. * The default is 'Y-m-d' */ dateFormat: 'Y-m-d', /** * @cfg {String} timeFormat * Convenience config for specifying the format of the time portion. * This value is overridden if format is specified in the timeConfig. * The default is 'H:i:s' */ timeFormat: 'H:i:s', // /** // * @cfg {String} dateTimeFormat // * The format used when submitting the combined value. // * Defaults to 'Y-m-d H:i:s' // */ // dateTimeFormat: 'Y-m-d H:i:s', /** * @cfg {Object} dateConfig * Additional config options for the date field. */ dateConfig: {}, /** * @cfg {Object} timeConfig * Additional config options for the time field. */ timeConfig: {}, // properties dateValue: null, // Holds the actual date /** * @property dateField * @type Ext.form.field.Date */ dateField: null, /** * @property timeField * @type Ext.form.field.Time */ timeField: null, initComponent: function () { var me = this , i = 0 , key , tab; me.items = me.items || []; me.dateField = Ext.create('Ext.form.field.Date', Ext.apply({ format: me.dateFormat, flex: 1, isFormField: false, //exclude from field query's submitValue: false }, me.dateConfig)); me.items.push(me.dateField); me.timeField = Ext.create('Ext.form.field.Time', Ext.apply({ format: me.timeFormat, flex: 1, isFormField: false, //exclude from field query's submitValue: false }, me.timeConfig)); me.items.push(me.timeField); for (; i < me.items.length; i++) { me.items[i].on('focus', Ext.bind(me.onItemFocus, me)); me.items[i].on('blur', Ext.bind(me.onItemBlur, me)); me.items[i].on('specialkey', function (field, event) { key = event.getKey(); tab = key == event.TAB; if (tab && me.focussedItem == me.dateField) { event.stopEvent(); me.timeField.focus(); return; } me.fireEvent('specialkey', field, event); }); } me.callParent(); // this dummy is necessary because Ext.Editor will not check whether an inputEl is present or not // this.inputEl = { // dom: {}, // swallowEvent: function () { } // }; me.initField(); }, focus: function () { this.callParent(); Ext.defer(this.dateField.focus, 100, this.dateField); }, onItemFocus: function (item) { if (this.blurTask) { this.blurTask.cancel(); } this.focussedItem = item; }, onItemBlur: function (item, e) { /*var me = this; if (item != me.focussedItem) { return; } // 100ms to focus a new item that belongs to us, otherwise we will assume the user left the field me.blurTask = new Ext.util.DelayedTask(function () { me.fireEvent('blur', me, e); }); me.blurTask.delay(100);*/ }, getValue: function () { var value = null , date = this.dateField.getSubmitValue() , time = this.timeField.getSubmitValue() , format; if (date) { if (time) { format = this.getFormat(); value = Ext.Date.parse(date + ' ' + time, format); } else { value = this.dateField.getValue(); } } return value; }, getSubmitValue: function () { // var value = this.getValue(); // return value ? Ext.Date.format(value, this.dateTimeFormat) : null; var me = this , format = me.getFormat() , value = me.getValue(); return value ? Ext.Date.format(value, format) : null; }, setValue: function (value) { if (Ext.isString(value)) { value = Ext.Date.parse(value, this.getFormat()); //this.dateTimeFormat } this.dateField.setValue(value); this.timeField.setValue(value); }, getFormat: function () { return (this.dateField.submitFormat || this.dateField.format) + " " + (this.timeField.submitFormat || this.timeField.format); }, // Bug? A field-mixin submits the data from getValue, not getSubmitValue getSubmitData: function () { var me = this , data = null; if (!me.disabled && me.submitValue && !me.isFileUpload()) { data = {}; data[me.getName()] = '' + me.getSubmitValue(); } return data; }, isValid: function () { return this.dateField.isValid() && this.timeField.isValid(); } });