1、Ext.form.field.Date主要配置
Ext.form.field.Date主要配置項
| 配置項 | 類型 | 說明 |
|---|---|---|
| altFormats | String | 多個日期輸入格式組成的字符串，不同的格式之間使用“|”進行分隔。將使用這些格式來解析用戶的輸入信息。 默認值為"m/d/y|n/j/y|m/j/y|n/d/y|m/j/Y|n/d/Y|m-d-y|m-d-Y|m/d|m-d|md|mdy|mdY|d|Y-m-d|n-j|n/j" |
| disabledDates | Array | 禁止選擇日期組成的數組 |
| disabledDatesText | String | 選擇禁止日期時提示的消息 |
| disabledDays | Array | 禁止選擇的星期組成的數組，0-周日，1-周一， ...，6-周六，默認為undefined |
| format | String | 日期顯示格式，默認為"m/d/y" |
| invalidText | String | 輸入無效日期時的提示消息 |
| maxValue | Date/String | 允許選擇的最大日期 |
| maxText | String | 大於最大日期時的提示消息 |
| minValue | Date/String | 允許選擇的最小日期 |
| minText | String | 小於最小日期時的提示消息 |
| showToday | Boolean | 是否顯示“今天”選擇按鈕，默認為true |
| submitFormat | String | 提交到服務器端的日期格式，默認為format |
disabledDates配置格式及說明：
| 說明 | 示例 |
|---|---|
| ["05/01/2012","05/02/2012"] | 禁止選擇2012年05月01日和2012年05月02日 |
| ["05/01","05/02"] | 禁止選擇每年年05月01日和05月02日 |
| ["05/01"] | 禁止選擇每年年05月01 |
| ["03/../2012"] | 禁止選擇2012年3月份的任何一天 |
| ["^03"] | 禁止選擇每年3月份的任何一天 |
日期顯示格式說明：
| 說明 | 說明 | 示例 |
|---|---|---|
| d | 日期的數字表示，帶前綴0 | 01至31 |
| j | 日期的數字表示，不帶前綴 | 1至31 |
| D | 星期的縮寫表示 | Sun-Sat |
| I | 日期的完整表示 | Sunday至Saturday |
| N | ISO-8601中規定的星期的數字表示 | 1表示周一，7表示周日 |
| S | 英文日期的2字母后綴 | st,nd,th，常與j配合使用，組成1st，2nd形式的日期描述 |
| w | 星期的數字表示 | 0-周日，...，7-周日 |
| z | 一年中的第幾天，從0開始 | 0至364 |
| W | ISO-8601中規定的星期在一年中的數字表示。每星期從周一開始 | 01至53 |
| F | 月份的完整表示 | January至December |
| m | 月份的數字表示，帶前綴0 | 01至12 |
| M | 月份的縮寫表示 | Jan至Dec |
| n | 月份的數字表示，不帶前綴0 | 1至12 |
| t | 特定月份的天數 | 28至31 |
| L | 特定年是否為閏年 | 1表示閏年，0表示非閏年 |
| o | ISO-8601中規定的四位年數份 | 2012 |
| Y | 年份的四位數表示 | 2012 |
| y | 年份的兩位數表示 | 12 |
2、示例
代碼：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <title>Ext.form.field.Date示例</title> <link href="ext-4.0.7-gpl/resources/css/ext-all.css" rel="stylesheet" type="text/css" /> <script src="ext-4.0.7-gpl/bootstrap.js" type="text/javascript"></script> <script type="text/javascript"> Ext.onReady(function () { var frm = new Ext.form.Panel({ title: "Ext.form.field.Date示例", bodyStyle: "padding:5", frame: true, height: 100, width: 240, renderTo: Ext.getBody(), items: [{ fieldLabel: "日期選擇框", labelWidth: 80, width: 230, xtype: "datefield", labelSeparator: "：", labelAlign: "left", msgTarget: "side", autoFitErrors: false, maxValue: "12/31/2012", maxText: "日期應小於{0}", minValue: "01/01/2012", minText: "日期應大於{0}", format: "Y年m月d日", invalidText: "日期格式無效", disabledDates: ["2012年04月22日"], disabledDatesText:"禁止選擇該日期", disabledDays:[0,6], // 禁止選擇周六和周日 disabledDaysText:"禁止選擇該日期", width:230, value:"04/23/2012" }] }); }); </script> </head> <body> </body> </html>
效果圖：
