自定義的驗證主要有兩種方式：一種是單欄位的自定義驗證，另一種是多欄位間的驗證。對於單欄位的驗證主要通過regex配置項指定自定義正則表示式進行驗證，而欄位多的驗證可以通過字定義VType型別進行驗證支援。

自定義的驗證主要有兩種方式：一種是單欄位的自定義驗證，另一種是多欄位間的驗證。對於單欄位的驗證主要通過regex配置項指定自定義正則表示式進行驗證，而欄位多的驗證可以通過字定義VType型別進行驗證支援。

[javascript] view plain copy

1. Ext.apply(Ext.form.VTypes,     
2. {    
3.     daterange: function(val, field)     
4.     {    
5.         var date = field.parseDate(val);    
6.         
7.         // We need to force the picker to update values to recaluate the disabled dates display    
8.         var dispUpd = function(picker)     
9.         {    
10.             var ad = picker.activeDate;    
11.             picker.activeDate = null;    
12.             picker.update(ad);    
13.         };    
14.         
15.         if (field.startDateField)     
16.         {    
17.             var sd = Ext.getCmp(field.startDateField);    
18.             sd.maxValue = date;    
19.             if (sd.menu && sd.menu.picker)     
20.             {    
21.                 sd.menu.picker.maxDate = date;    
22.                 dispUpd(sd.menu.picker);    
23.             }    
24.         }     
25.         else if (field.endDateField)     
26.         {    
27.             var ed = Ext.getCmp(field.endDateField);    
28.             ed.minValue = date;    
29.             if (ed.menu && ed.menu.picker)     
30.             {    
31.                 ed.menu.picker.minDate = date;    
32.                 dispUpd(ed.menu.picker);    
33.             }    
34.         }    
35.         return true;    
36.     },    
37.       
38.   password: function(val, field)     
39.   {    
40.         if (field.initialPassField)     
41.         {    
42.             var pwd = Ext.getCmp(field.initialPassField);    
43.             return (val == pwd.getValue());     
44.         }    
45.         return true;    
46.   },    
47.   passwordText: '兩次輸入的密碼不一致！',    
48.       
49.   chinese:function(val,field)    
50.   {    
51.         var reg = /^[/u4e00-/u9fa5]+$/i;    
52.         if(!reg.test(val))    
53.         {    
54.             return false;    
55.         }    
56.         return true;    
57.   },    
58.   chineseText:'請輸入中文',    
59.       
60.   age:function(val,field)    
61.   {    
62.         try    
63.         {    
64.             if(parseInt(val) >= 18 && parseInt(val) <= 100)    
65.                 return true;    
66.             return false;    
67.         }    
68.         catch(err)     
69.         {    
70.             return false;    
71.         }    
72.   },    
73.   ageText:'年齡輸入有誤',    
74.       
75.   alphanum:function(val,field)    
76.   {    
77.         try    
78.         {    
79.             if(!//W/.test(val))    
80.                 return true;    
81.             return false;    
82.         }    
83.         catch(e)    
84.         {    
85.             return false;    
86.         }    
87.   },    
88.   alphanumText:'請輸入英文字母或是數字,其它字元是不允許的.',    
89.       
90.   url:function(val,field)    
91.   {    
92.         try    
93.         {    
94.             if(/^(http|https|ftp):////(([A-Z0-9][A-Z0-9_-]*)(/.[A-Z0-9][A-Z0-9_-]*)+)(:(/d+))?//?/i.test(val))    
95.                 return true;    
96.             return false;    
97.         }    
98.         catch(e)    
99.         {    
100.             return false;    
101.         }    
102.   },    
103.   urlText:'請輸入有效的URL地址.',    
104.       
105.   max:function(val,field)    
106.   {    
107.         try    
108.         {    
109.             if(parseFloat(val) <= parseFloat(field.max))    
110.                 return true;    
111.             return false;    
112.         }    
113.         catch(e)    
114.         {    
115.             return false;    
116.         }    
117.   },    
118.   maxText:'超過最大值',    
119.       
120.   min:function(val,field)    
121.   {    
122.         try    
123.         {    
124.             if(parseFloat(val) >= parseFloat(field.min))    
125.                 return true;    
126.             return false;    
127.         }    
128.         catch(e)    
129.         {    
130.             return false;    
131.         }    
132.   },    
133.   minText:'小於最小值',    
134.           
135.   datecn:function(val,field)    
136.   {    
137.         try    
138.         {    
139.             var regex = /^(/d{4})-(/d{2})-(/d{2})$/;    
140.             if(!regex.test(val)) return false;    
141.             var d = new Date(val.replace(regex, '$1/$2/$3'));    
142.             return (parseInt(RegExp.$2, 10) == (1+d.getMonth())) && (parseInt(RegExp.$3, 10) == d.getDate())&&(parseInt(RegExp.$1, 10) == d.getFullYear());    
143.         }    
144.         catch(e)    
145.         {    
146.             return false;    
147.         }    
148.   },    
149.   datecnText:'請使用這樣的日期格式: yyyy-mm-dd. 例如:2008-06-20.',    
150.       
151.   integer:function(val,field)    
152.   {    
153.         try    
154.         {    
155.             if(/^[-+]?[/d]+$/.test(val))    
156.                 return true;    
157.             return false;    
158.         }    
159.         catch(e)    
160.         {    
161.             return false;    
162.         }    
163.   },    
164.   integerText:'請輸入正確的整數',    
165.       
166.   minlength:function(val,field)    
167.   {    
168.         try    
169.         {    
170.             if(val.length >= parseInt(field.minlen))    
171.                 return true;    
172.             return false    
173.         }    
174.         catch(e)    
175.         {    
176.             return false;    
177.         }    
178.   },    
179.   minlengthText:'長度過小',    
180.       
181.   maxlength:function(val,field)    
182.   {    
183.      try    
184.      {    
185.         if(val.length <= parseInt(field.maxlen))    
186.             return true;    
187.         return false;    
188.      }    
189.      catch(e)    
190.      {    
191.         return false;    
192.      }    
193.   },    
194.   maxlengthText:'長度過大',    
195.       
196.   ip:function(val,field)    
197.   {    
198.         try    
199.         {    
200.             if((/^(?:(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)/.){3}(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)$/.test(val)))    
201.                 return true;    
202.             return false;    
203.         }    
204.         catch(e)    
205.         {    
206.             return false;    
207.         }    
208.   },    
209.   ipText:'請輸入正確的IP地址',    
210.       
211.   phone:function(val,field)    
212.   {    
213.         try    
214.         {    
215.             if(/^((0[1-9]{3})?(0[12][0-9])?[-])?/d{6,8}$/.test(val))    
216.                 return true;    
217.             return false;    
218.         }    
219.         catch(e)    
220.         {    
221.             return false;    
222.         }    
223.   },    
224.   phoneText:'請輸入正確的電話號碼,如:0920-29392929',    
225.       
226.   mobilephone:function(val,field)    
227.   {    
228.         try    
229.         {    
230.             if(/(^0?[1][35][0-9]{9}$)/.test(val))    
231.                 return true;    
232.             return false;    
233.         }    
234.         catch(e)    
235.         {    
236.             return false;    
237.         }    
238.   },    
239.   mobilephoneText:'請輸入正確的手機號碼',    
240.       
241.   alpha:function(val,field)    
242.   {    
243.         try    
244.         {    
245.             if( /^[a-zA-Z]+$/.test(val))    
246.                 return true;    
247.             return false;    
248.         }    
249.         catch(e)    
250.         {    
251.             return false;    
252.         }    
253.   },    
254.   alphaText:'請輸入英文字母'    
255. });    

另外一種方式擴充套件一些VType，基本上是用正在表示式的，方便做驗證了。

：

[javascript] view plain copy

1. Ext.form.VTypes["hostnameVal1"] = /^[a-zA-Z][-.a-zA-Z0-9]{0,254}$/;  
2. Ext.form.VTypes["hostnameVal2"] = /^[a-zA-Z]([-a-zA-Z0-9]{0,61}[a-zA-Z0-9]){0,1}([.][a-zA-Z]([-a-zA-Z0-9]{0,61}[a-zA-Z0-9]){0,1}){0,}$/;  
3. Ext.form.VTypes["ipVal"] = /^([1-9][0-9]{0,1}|1[013-9][0-9]|12[0-689]|2[01][0-9]|22[0-3])([.]([1-9]{0,1}[0-9]|1[0-9]{2}|2[0-4][0-9]|25[0-5])){2}[.]([1-9][0-9]{0,1}|1[0-9]{2}|2[0-4][0-9]|25[0-4])$/;  
4. Ext.form.VTypes["netmaskVal"] = /^(128|192|224|24[08]|25[245].0.0.0)|(255.(0|128|192|224|24[08]|25[245]).0.0)|(255.255.(0|128|192|224|24[08]|25[245]).0)|(255.255.255.(0|128|192|224|24[08]|252))$/;  
5. Ext.form.VTypes["portVal"] = /^(0|[1-9][0-9]{0,3}|[1-5][0-9]{4}|6[0-4][0-9]{3}|65[0-4][0-9]{2}|655[0-2][0-9]|6553[0-5])$/;  
6. Ext.form.VTypes["multicastVal"] = /^((22[5-9]|23[0-9])([.](0|[1-9][0-9]{0,1}|1[0-9]{2}|2[0-4][0-9]|25[0-5])){3})|(224[.]([1-9][0-9]{0,1}|1[0-9]{2}|2[0-4][0-9]|25[0-5])([.](0|[1-9][0-9]{0,1}|1[0-9]{2}|2[0-4][0-9]|25[0-5])){2})|(224[.]0[.]([1-9][0-9]{0,1}|1[0-9]{2}|2[0-4][0-9]|25[0-5])([.](0|[1-9][0-9]{0,1}|1[0-9]{2}|2[0-4][0-9]|25[0-5])))$/;  
7. Ext.form.VTypes["usernameVal"] = /^[a-zA-Z][-_.a-zA-Z0-9]{0,30}$/;  
8. Ext.form.VTypes["passwordVal1"] = /^.{6,31}$/;  
9. Ext.form.VTypes["passwordVal2"] = /[^a-zA-Z].*[^a-zA-Z]/;  
10. Ext.form.VTypes["hostname"]=function(v){  
11.  if(!Ext.form.VTypes["hostnameVal1"].test(v)){  
12.   Ext.form.VTypes["hostnameText"]="Must begin with a letter and not exceed 255 characters"  
13.   return false;  
14.  }  
15.  Ext.form.VTypes["hostnameText"]="L[.L][.L][.L][...] where L begins with a letter, ends with a letter or number, and does not exceed 63 characters";  
16.  return Ext.form.VTypes["hostnameVal2"].test(v);  
17. }  
18. Ext.form.VTypes["hostnameText"]="Invalid Hostname"  
19. Ext.form.VTypes["hostnameMask"]=/[-.a-zA-Z0-9]/;  
20. Ext.form.VTypes["ip"]=function(v){  
21.  return Ext.form.VTypes["ipVal"].test(v);  
22. }  
23. Ext.form.VTypes["ipText"]="1.0.0.1 - 223.255.255.254 excluding 127.x.x.x"  
24. Ext.form.VTypes["ipMask"]=/[.0-9]/;  
25. Ext.form.VTypes["netmask"]=function(v){  
26.  return Ext.form.VTypes["netmaskVal"].test(v);  
27. }  
28. Ext.form.VTypes["netmaskText"]="128.0.0.0 - 255.255.255.252"  
29. Ext.form.VTypes["netmaskMask"]=/[.0-9]/;  
30. Ext.form.VTypes["port"]=function(v){  
31.  return Ext.form.VTypes["portVal"].test(v);  
32. }  
33. Ext.form.VTypes["portText"]="0 - 65535"  
34. Ext.form.VTypes["portMask"]=/[0-9]/;  
35. Ext.form.VTypes["multicast"]=function(v){  
36.  return Ext.form.VTypes["multicastVal"].test(v);  
37. }  
38. Ext.form.VTypes["multicastText"]="224.0.1.0 - 239.255.255.255"  
39. Ext.form.VTypes["multicastMask"]=/[.0-9]/;  
40. Ext.form.VTypes["username"]=function(v){  
41.  return Ext.form.VTypes["usernameVal"].test(v);  
42. }  
43. Ext.form.VTypes["usernameText"]="Username must begin with a letter and cannot exceed 255 characters"  
44. Ext.form.VTypes["usernameMask"]=/[-_.a-zA-Z0-9]/;  
45. Ext.form.VTypes["password"]=function(v){  
46.  if(!Ext.form.VTypes["passwordVal1"].test(v)){  
47.   Ext.form.VTypes["passwordText"]="Password length must be 6 to 31 characters long";  
48.   return false;  
49.  }  
50.  Ext.form.VTypes["passwordText"]="Password must include atleast 2 numbers or symbols";  
51.  return Ext.form.VTypes["passwordVal2"].test(v);  
52. }  
53. Ext.form.VTypes["passwordText"]="Invalid Password"  
54. Ext.form.VTypes["passwordMask"]=/./;  

另外寫一下Extjs form 元件

1、Ext.form.Action

     配置項：
          success：執行成功後回撥的函式，包括兩個引數：form和action
          failure：執行失敗後回撥的函式，包括兩個引數：form和action
          method：表單的提交方式，有效值包括GET、POST
          params：傳遞到請求中的引數
          url：動作提交的路徑
          waitMsg：動作執行時顯示的等待資訊
     屬性：
          Action.CLIENT_INVALID：客戶端驗證錯誤
          Action.CONNECT_FAILURE：通訊錯誤
          Action.LOAD_FAILURE：載入資料時，沒有包含data屬性的欄位被返回
          Action.SERVER_INVALID：服務端驗證錯誤
          failureType：錯誤型別
          result：包含布林型別的success屬性和其他屬性，如{success: true, msg: 'ok'}
          type：動作型別，可選值有submit和load
               Ext.form.Action.Submit：返回的資訊中要包含一個布林型別的success屬性和一個可選的errors屬性
               Ext.form.Action.Load：返回的資訊中要包含一個布林型別的success屬性和一個data屬性

2、Ext.form.BasicForm

     配置項：
          baseParams：傳遞到請求中的引數
          method：表單的提交方式，有效值包括GET、POST
          url：表單預設的提交路徑
          fileUpload：表單是否進行檔案上傳
          timeout：表單動作的超時時間，預設為30秒
          trackResetOnLoad：是否在表單初次建立時清楚資料
    方法：
          doAction( String/Object actionName, [Object options] )：執行一個預訂的動作，可用選項包括：
              url：動作提交的路徑
              method：表單的提交方式，有效值包括GET、POST
              params：傳遞到請求中的引數
              headers：
              success：執行成功後回撥的函式，包括兩個引數：form和action
              failure：執行失敗後回撥的函式，包括兩個引數：form和action
              clientValidation：是否客戶端驗證
          clearInvalid()：清除表單中所有的無效驗證資訊
          findField( String id )：查詢表單欄位
          getValues( [Boolean asString] )：
          isDirty()：表單資料是否被更改過
          isValid()：客戶端驗證是否成功
          load( Object options )：執行表單讀取動作
          loadRecord( Record record )：從一個數據記錄中讀取資料到表單中
          markInvalid( Array/Object errors )：成批設定表單欄位為驗證無效
          reset()：重置表單
          setValues( Array/Object values )：成批設定表單欄位值
          submit( Object options )：執行表單提交動作
          updateRecord( Record record )：持久化表單資料到記錄集中

3、Ext.form.FormPanel

     配置項：
          items：一個元素或元素陣列
          buttons：一個按鈕配置物件的陣列，按鈕將被新增到表單頁尾中
          buttonAlign：按鈕的對齊方式，可選值有left、center、right，預設為center
          labelWidth：表單標籤的寬度
          labelAlign：表單標籤的對齊方式，可選值有left、top、right，預設為left
          labelSeparator：欄位標籤與欄位之間的分隔符，預設為':'
          minButtonWidth：按鈕的最小寬度，預設為75
     方法：
          getForm() : Ext.form.BasicForm
          load( Object options )
          startMonitoring()
          stopMonitoring()

4、Ext.form.Field

    配置項：
          name：欄位名
          value：欄位的初始化值
          disabled：欄位是否不可用，預設為false
          fieldLabel：欄位標籤說明
          hideLabel：隱藏欄位標籤，預設為false
          labelSeparator：欄位標籤與欄位之間的分隔符，預設為':'
          labelStyle：欄位標籤樣式
          inputType：預設為text
          invalidClass：預設為x-form-invalid
          invalidText：欄位非法文字提示
          msgTarget：錯誤資訊顯示的位置，預設為qtip
              qtip：顯示一個浮動的提示資訊
              title：顯示一個瀏覽器的浮動提示資訊
              under：在欄位下方顯示一個提示資訊
              side：在欄位右邊顯示一個提示資訊
          readOnly：欄位是否只讀，預設為false
          validateOnBlur：欄位在失去焦點時被驗證，預設為true
     方法：
          clearInvalid()：
          getRawValue()
          setRawValue( Mixed value )
          getValue()
          setValue( Mixed value )
          isDirty()：欄位值在裝載後是否被修改過
          isValid( Boolean preventMark )：當前欄位值是否合法
          markInvalid( [String msg] )
          validate()
          reset()

5、Ext.form.Hidden

6、Ext.form.Label

     配置項：

          html：

          text：

7、Ext.form.TextField

     配置項：
          allowBlank：是否允許為空，預設為true
          blankText：空驗證失敗後顯示的提示資訊
          emptyText：在一個空欄位中預設顯示的資訊
          grow：欄位是否自動伸展和收縮，預設為false
          growMin：收縮的最小寬度
          growMax：伸展的最大寬度
          inputType：欄位型別：預設為text
          maskRe：用於過濾不匹配字元輸入的正則表示式
          maxLength：欄位允許輸入的最大長度
          maxLengthText：最大長度驗證失敗後顯示的提示資訊
          minLength：欄位允許輸入的最小長度
          minLengthText：最小長度驗證失敗後顯示的提示資訊
          regex：正則表示式
          regexText：正則表示式驗證失敗後顯示的提示資訊
          vtype：驗證型別的名字
               alpha：限制只能輸入字母
               alphanum：限制只能輸入字母和數字
               email
               url
          vtypeText：驗證失敗時的提示資訊
          validator：自定義驗證函式
          selectOnFocus：當欄位得到焦點時自動選擇已存在的文字，預設為false

8、Ext.form.TextArea
      配置項：
           preventScrollbars：是否禁止出現滾動條，預設為false

9、Ext.form.NumberField
      配置項：
           allowDecimals：是否允許輸入小數，預設為true
           allowNegative：是否允許輸入負數，預設為true
           baseChars：輸入的有效數字集合，預設為'0123456789'
           decimalPrecision：數字的精度，預設保留小數點後2位
           decimalSeparator：十進位制分隔符，預設為'.'
           maxValue：允許輸入的最大數值
           maxText：超過最大值之後的提示資訊
           minValue：允許輸入的最小數值
           minText：超過最小值之後的提示資訊
           nanText：輸入非有效數值之後的提示資訊

10、Ext.form.Checkbox
      配置項：
           boxLabel：複選框的文字描述
           checked：複選框是否被選擇，預設為false
           handler：當checked值改變時觸發的函式，函式包含兩個引數：checkbox、checked
           inputValue：
     方法：
           getValue()：返回複選框的checked狀態
           setValue( Boolean/String checked )：

11、Ext.form.CheckboxGroup
     配置項：
           allowBlank：是否允許不選擇，預設為true
           blankText：
           columns：顯示的列數，可選值包括：固定值auto、數值、陣列（整數、小數）
           items：物件陣列
           vertical：是否垂直方向顯示物件，預設為false

12、Ext.form.Radio
     方法：
           getGroupValue()：
           setValue( value {String/Boolean} )：

13、Ext.form.RadioGroup
     配置項：
           allowBlank：
           blankText：

14、Ext.form.ComboBox
      配置項：
           displayField：被顯示在下拉框中的欄位名
           editable：是否可編輯，預設為true
           forceSelection：輸入值是否嚴格為待選列表中存在的值。如果輸入不存在的值，會自動選擇第一個最接近的值。
           hiddenName：隱藏欄位的名字，如果提供該引數則一個隱藏欄位將被建立，用來儲存所選值，當表單提交時在伺服器端可以通過該名字取得列表中的所選值
           listWidth：下拉列表的寬度
           minListWidth：下拉列表的最小寬度，預設為70畫素
           loadingText：當下拉框載入資料時顯示的提示資訊，只有當mode='remote'時才會生效
           maxHeight：下拉列表框的最大高度，預設為300畫素
           minChars：下拉列表框自動選擇前使用者需要輸入的最小字元數量。mode='remote'預設為4，mode='local'預設為0
           mode：下拉列表框的資料讀取模式。remote讀取遠端資料，local讀取本地資料
           pageSize：下拉列表框的分頁大小。該項設定只在mode='remote'時生效
           queryParam：查詢的名字，預設為'query'，將被傳遞到查詢字串中
           allQuery：一個發往伺服器用來查詢全部資訊的查詢字串，預設為空字串''
           selectOnFocus：當獲得焦點時立刻選擇一個已存在的列表項。預設為false，此項只有在editable=true時才會生效
           store：列表框繫結的資料來源
           transform：將頁面中已存在的元素轉換為組合框
           lazyInit：延時初始化下拉列表，預設為true
           lazyRender：延時渲染，預設為false
           triggerAction：設定單擊觸發按鈕時執行的預設操作，有效值包括all和query，預設為query，如果設定為all則會執行allQuery中設定的查詢
           typeAhead：設定在輸入過程中是否自動選擇匹配的剩餘部分文字（選擇第一個滿足條件的），預設為false
           value：初始化組合框中的值
           valueField：組合框的值欄位
           valueNotFoundText：值不存在時的提示資訊
           tpl：Ext模板字串或模板物件，可以通過該配置項自定義下拉列表的顯示方式

     方法：
           clearValue()：清空欄位當前值
           doQuery( String query, Boolean forceAll )：
           getValue()：
           getStore()：
           setValue( String value )：

15、Ext.form.DateField
     配置項：
           maxValue：允許選擇的最大日期
           maxText：當日期大於最大值時的錯誤提示資訊
           minValue：允許選擇的最小時間
           minText：當日期小於最小值時的錯誤提示資訊
           format：日期顯示格式，預設為“m/d/y”，一般使用“Y-m-d”
               Y：四位年份
               m：帶字首0的月份
               d：帶字首0的日期
               y：兩位年份
               n：不帶字首0的月份
               j：不帶字首0的日期
               w：星期的數字，0表示星期日，1代表星期一
           showToday：是否顯示今天按鈕，預設為true
           altFormats：多個日期輸入格式組成的字串，不同的格式之間使用“|”進行分割，預設值為'm/d/Y|n/j/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'
           disabledDates：禁止選擇的日期組成的陣列
           disabledDatesText：選擇禁選日期時顯示的提示資訊
           disabledDays：禁止選擇的星期組成的陣列，0代表星期日，1代表星期一
           disabledDaysText：選擇禁選星期時顯示的提示資訊
           invalidText：當日期值非法時顯示的提示資訊
     方法：
           getValue()：取得日期值

16、Ext.form.FieldSet
      配置項：
           animCollapse：動畫摺疊，預設為false
           checkboxToggle：設定是否顯示欄位集的checkbox選擇框，預設為false
           checkboxName：指定欄位集中用於展開或隱藏欄位集面板的checkbox的名字，該屬性只有在checkboxToggle為true時生效
           labelWidth：欄位標籤的寬度，可以級聯到子容器
           layout：佈局，預設為form

17、Ext.form.TimeField
      配置項：
           maxValue：列表中允許的最大時間
           maxText：當時間大於最大值時的錯誤提示資訊
           minValue：列表中允許的最小時間
           minText：當時間小於最小值時的錯誤提示資訊
           increment：兩個相鄰選項間的時間間隔，預設為15分鐘
           format：顯示格式，預設為“g:i A”。一般使用“H:i:s”
                H：帶字首0的24小時
                i：帶字首0的分鐘
                s：帶字首0的秒
           invalidText：當時間值非法時顯示的提示資訊
           altFormats：多個時間輸入格式組成的字串，不同的格式之間使用“|”進行分割

另外一種方式擴充套件一些VType，基本上是用正在表示式的，方便做驗證了。

：

[javascript] view plain copy

1. Ext.form.VTypes["hostnameVal1"] = /^[a-zA-Z][-.a-zA-Z0-9]{0,254}$/;  
2. Ext.form.VTypes["hostnameVal2"] = /^[a-zA-Z]([-a-zA-Z0-9]{0,61}[a-zA-Z0-9]){0,1}([.][a-zA-Z]([-a-zA-Z0-9]{0,61}[a-zA-Z0-9]){0,1}){0,}$/;  
3. Ext.form.VTypes["ipVal"] = /^([1-9][0-9]{0,1}|1[013-9][0-9]|12[0-689]|2[01][0-9]|22[0-3])([.]([1-9]{0,1}[0-9]|1[0-9]{2}|2[0-4][0-9]|25[0-5])){2}[.]([1-9][0-9]{0,1}|1[0-9]{2}|2[0-4][0-9]|25[0-4])$/;  
4. Ext.form.VTypes["netmaskVal"] = /^(128|192|224|24[08]|25[245].0.0.0)|(255.(0|128|192|224|24[08]|25[245]).0.0)|(255.255.(0|128|192|224|24[08]|25[245]).0)|(255.255.255.(0|128|192|224|24[08]|252))$/;  
5. Ext.form.VTypes["portVal"] = /^(0|[1-9][0-9]{0,3}|[1-5][0-9]{4}|6[0-4][0-9]{3}|65[0-4][0-9]{2}|655[0-2][0-9]|6553[0-5])$/;  
6. Ext.form.VTypes["multicastVal"] = /^((22[5-9]|23[0-9])([.](0|[1-9][0-9]{0,1}|1[0-9]{2}|2[0-4][0-9]|25[0-5])){3})|(224[.]([1-9][0-9]{0,1}|1[0-9]{2}|2[0-4][0-9]|25[0-5])([.](0|[1-9][0-9]{0,1}|1[0-9]{2}|2[0-4][0-9]|25[0-5])){2})|(224[.]0[.]([1-9][0-9]{0,1}|1[0-9]{2}|2[0-4][0-9]|25[0-5])([.](0|[1-9][0-9]{0,1}|1[0-9]{2}|2[0-4][0-9]|25[0-5])))$/;  
7. Ext.form.VTypes["usernameVal"] = /^[a-zA-Z][-_.a-zA-Z0-9]{0,30}$/;  
8. Ext.form.VTypes["passwordVal1"] = /^.{6,31}$/;  
9. Ext.form.VTypes["passwordVal2"] = /[^a-zA-Z].*[^a-zA-Z]/;  
10. Ext.form.VTypes["hostname"]=function(v){  
11.  if(!Ext.form.VTypes["hostnameVal1"].test(v)){  
12.   Ext.form.VTypes["hostnameText"]="Must begin with a letter and not exceed 255 characters"  
13.   return false;  
14.  }  
15.  Ext.form.VTypes["hostnameText"]="L[.L][.L][.L][...] where L begins with a letter, ends with a letter or number, and does not exceed 63 characters";  
16.  return Ext.form.VTypes["hostnameVal2"].test(v);  
17. }  
18. Ext.form.VTypes["hostnameText"]="Invalid Hostname"  
19. Ext.form.VTypes["hostnameMask"]=/[-.a-zA-Z0-9]/;  
20. Ext.form.VTypes["ip"]=function(v){  
21.  return Ext.form.VTypes["ipVal"].test(v);  
22. }  
23. Ext.form.VTypes["ipText"]="1.0.0.1 - 223.255.255.254 excluding 127.x.x.x"  
24. Ext.form.VTypes["ipMask"]=/[.0-9]/;  
25. Ext.form.VTypes["netmask"]=function(v){  
26.  return Ext.form.VTypes["netmaskVal"].test(v);  
27. }  
28. Ext.form.VTypes["netmaskText"]="128.0.0.0 - 255.255.255.252"  
29. Ext.form.VTypes["netmaskMask"]=/[.0-9]/;  
30. Ext.form.VTypes["port"]=function(v){  
31.  return Ext.form.VTypes["portVal"].test(v);  
32. }  
33. Ext.form.VTypes["portText"]="0 - 65535"  
34. Ext.form.VTypes["portMask"]=/[0-9]/;  
35. Ext.form.VTypes["multicast"]=function(v){  
36.  return Ext.form.VTypes["multicastVal"].test(v);  
37. }  
38. Ext.form.VTypes["multicastText"]="224.0.1.0 - 239.255.255.255"  
39. Ext.form.VTypes["multicastMask"]=/[.0-9]/;  
40. Ext.form.VTypes["username"]=function(v){  
41.  return Ext.form.VTypes["usernameVal"].test(v);  
42. }  
43. Ext.form.VTypes["usernameText"]="Username must begin with a letter and cannot exceed 255 characters"  
44. Ext.form.VTypes["usernameMask"]=/[-_.a-zA-Z0-9]/;  
45. Ext.form.VTypes["password"]=function(v){  
46.  if(!Ext.form.VTypes["passwordVal1"].test(v)){  
47.   Ext.form.VTypes["passwordText"]="Password length must be 6 to 31 characters long";  
48.   return false;  
49.  }  
50.  Ext.form.VTypes["passwordText"]="Password must include atleast 2 numbers or symbols";  
51.  return Ext.form.VTypes["passwordVal2"].test(v);  
52. }  
53. Ext.form.VTypes["passwordText"]="Invalid Password"  
54. Ext.form.VTypes["passwordMask"]=/./;  

另外寫一下Extjs form 元件

1、Ext.form.Action

     配置項：
          success：執行成功後回撥的函式，包括兩個引數：form和action
          failure：執行失敗後回撥的函式，包括兩個引數：form和action
          method：表單的提交方式，有效值包括GET、POST
          params：傳遞到請求中的引數
          url：動作提交的路徑
          waitMsg：動作執行時顯示的等待資訊
     屬性：
          Action.CLIENT_INVALID：客戶端驗證錯誤
          Action.CONNECT_FAILURE：通訊錯誤
          Action.LOAD_FAILURE：載入資料時，沒有包含data屬性的欄位被返回
          Action.SERVER_INVALID：服務端驗證錯誤
          failureType：錯誤型別
          result：包含布林型別的success屬性和其他屬性，如{success: true, msg: 'ok'}
          type：動作型別，可選值有submit和load
               Ext.form.Action.Submit：返回的資訊中要包含一個布林型別的success屬性和一個可選的errors屬性
               Ext.form.Action.Load：返回的資訊中要包含一個布林型別的success屬性和一個data屬性

2、Ext.form.BasicForm

     配置項：
          baseParams：傳遞到請求中的引數
          method：表單的提交方式，有效值包括GET、POST
          url：表單預設的提交路徑
          fileUpload：表單是否進行檔案上傳
          timeout：