• <menu id="oqooq"><table id="oqooq"></table></menu>
  • <bdo id="oqooq"><noscript id="oqooq"></noscript></bdo>

    EXTJS7 自定義日期時間選擇輸入框

    小編:管理員 404閱讀 2022.09.07

    效果組件定義
    Ext.define('PSR.field.Datetime', {
        extend: 'Ext.field.Container',
        xtype: 'psr-datetimefield',
        items: [{
            xtype: 'datefield', placeholder: '日期',
            dateFormat: 'Y-m-d',
            flex: 1
        }, {
            xtype: 'timefield', placeholder: '時間',
            format: 'H:i:s',
            flex: 1
        }],
        getValue: function () {
            var date = this.getAt(0).getRawValue();
            var time = this.getAt(1).getRawValue();
            return date && time ? (date + ' ' + time) : null;
        },
        setValue: function (value) {
            var datetime = value ? Ext.Date.parse(value, "Y-m-d H:i:s") : null;
            this.getAt(0).setValue(datetime);
            this.getAt(1).setValue(datetime);
        }
    });
    復制使用
    ...
    {
    	xtype: 'formpanel',
    	items:[{
    		xtype: 'psr-datetimefield',
    		name: 'datetimeprop',
    		label: '日期時間'
    	}]
    }
    ...
    form.setValues({datetimeprop: '2020-04-10 14:27:00'});
    var values = form.getValues();  // values: {datetimeprop: '2020-04-10 14:27:00'}
    復制
    關聯標簽:
    黄色一片
  • <menu id="oqooq"><table id="oqooq"></table></menu>
  • <bdo id="oqooq"><noscript id="oqooq"></noscript></bdo>