/**
 * 日期时间输入框，实则是由日期输入框+时间输入框组成。
 * @class Ext.form.DateTimeFieldUx
 * @extends Ext.form.Field
 * @author fbchen 陈富冰
 * @version 1.0 2011-07-21
 * 需要引用相关的文件：<pre>
 * <script type="text/javascript" src="<%=request.getContextPath()%>/ext/ux/Ext.form.DateTimeFieldUx.js"></script>
 * </pre>
 */
Ext.form.DateTimeFieldUx = Ext.extend(Ext.form.Field, {
    datetimeFormat: '{date} {time}',
    dateFormat: 'Y-m-d',
    timeFormat: 'H:i:s',
    
    dataField: null,
    timeField: null,
    
    // private
    initComponent : function() {
        Ext.form.DateTimeFieldUx.superclass.initComponent.call(this);
        
        this.defaultProps = ['allowBlank', 'blankText', 'disabled', 'readOnly', 'disabledClass',
            'emptyClass', 'emptyText', 'fieldClass', 'focusClass', 'invalidClass', 'overCls'];
            
        this.fieldTpl = new Ext.Template(
            '<table border="0" cellspacing="0" cellpadding="0" style="table-layout:fixed"><tbody><tr>',
            '<td nowarp="" width="50%" class="ux-dt-field"></td>',
            '<td nowarp="" width="50%" class="ux-dt-field"></td>',
            '</tr></tbody></table>'
        );
        
        this.dataField = this.dataField||{};
        this.timeField = this.timeField||{};
        if (this.dateFormat != null) {
            this.dataField.format = this.dateFormat;
        }
        if (this.timeFormat != null) {
            this.timeField.format = this.timeFormat;
        }
        this.applyDefaults(this.dataField, this.defaultProps);
        this.applyDefaults(this.timeField, this.defaultProps);
        
        Ext.apply(this.dataField, {
            hideLabel: true,
            anchor: '100%',
            value: this.dataValue
        });
        Ext.apply(this.timeField, {
            hideLabel: true,
            anchor: '100%',
            increment: 60,
            value: this.timeValue
        });
    },
    
    // private
    onRender : function(ct, position) {
        Ext.form.DateTimeFieldUx.superclass.onRender.call(this, ct, position);
        this.el.addClass('x-hidden');
        this.wrap = this.el.wrap({cls: "x-form-field-wrap"});
        
        this.tb = this.fieldTpl.append(this.wrap, {}, true);
        this.td1 = this.tb.child('TD.ux-dt-field:nth(1)');
        this.td2 = this.tb.child('TD.ux-dt-field:nth(2)');
        
        var w = this.wrap.getWidth();
        this.tb.setWidth(w);
        this.datefield = new Ext.form.DateField(this.dataField).render(this.td1);
        this.timefield = new Ext.form.TimeField(this.timeField).render(this.td2);
        
        // prevent input submission
        this.datefield.el.dom.removeAttribute('name');
        this.timefield.el.dom.removeAttribute('name');
        
        this.datefield.afterMethod('setValue', this.updateValue, this);
        this.timefield.afterMethod('setValue', this.updateValue, this);
    },
    
    /**
     * 设置默认值
     * @param {Object} target
     * @param {Array} props
     */
    applyDefaults: function(target, props) {
        var o = {};
        Ext.each(props, function(p){
            if (Ext.type(this[p]) != false) {
                o[p] = this[p];
            }
        }, this);
        Ext.apply(target, o);
    },
    
    // private - Subclasses should provide the validation implementation by overriding this
    validateValue : function(value) {
        if (!Ext.form.DateTimeFieldUx.superclass.validateValue.call(this, value)) {
            return false;
        }
        /*if (value != null) {
            var format = this.getDateTimeFormat();
            if (!Date.parseDate(value, format)) {
                this.markInvalid();
                return false;
            }
        }*/
        return true;
    },
    
    validate : function(){
        if (!this.datefield.validate()) {
            return false;
        }
        if (!this