ExtJs2.2实现的日期时间控件
/** * 日期时间输入框，实则是由日期输入框+时间输入框组成。 * @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%" width="50%" name="code"><script type="text/javascript" defer="defer">Ext.onReady(function(){ Ext.QuickTips.init(); // turn on validation errors beside the field globally Ext.form.Field.prototype.msgTarget = 'side'; var bd = Ext.getBody(); /* * ================ Simple form ======================= */ bd.createChild({tag: 'h2', html: 'Form 1 - Very Simple'}); var simple = new Ext.FormPanel({ labelWidth: 75, // label settings here cascade unless overridden frame:true, title: 'Simple Form', bodyStyle:'padding:5px 5px 0', width: 350, defaults: {width: 230}, defaultType: 'textfield', items: [{ fieldLabel: 'First Name', name: 'first', allowBlank:false },{ fieldLabel: 'Last Name', name: 'last' }, { fieldLabel: 'Date Time', name: 'datetime1', xtype:'datetimefield' }], buttons: [{ text: 'Save' },{ text: 'Cancel' }] }); simple.render(document.body);});</script>