1、Ext.from.field.Text組件主要配置項目表
| 配置項 | 類型 | 說明 |
|---|---|---|
| allowBlank | Boolean | 是否允許為空，默認為空true |
| blankText | String | 是否允許為空驗證失敗后提示消息 |
| disableKeyFilter | Boolean | 設置為true則禁用鍵盤輸入過濾，默認為false |
| emptyCls | String | 設置應用於空字段的樣式，默認為“x-form-empty-field”,該樣式會根據當前字段值自動進行添加或移除 |
| emptyText | String | 在一個空字段默認顯示的信息 |
| enableKeyEvents | Boolean | 是否啟用鍵盤事件代理 |
| enforceMaxLength | Boolean | 是否強制限制輸入的最大長度，默認為false，設置為true則用戶無法輸入超過最大長度的字符 |
| grow | Boolean | 設置字段是否根據內容字段進行伸展和收縮，默認為false |
| growAppend | String | 設置一個追加到當前值中的字符串，目的是計算預增長字段長度，並且僅當grow為true時生效，默認為大寫字母W |
| growMax | Number | 字段伸展的最大寬度，默認為800 |
| growMin | Number | 字段收縮的最小寬度，默認為30 |
| maskRe | RegExp | 輸入掩碼正則表達式，將過濾不匹配的鍵盤輸入 |
| maxLength | Number | 字段允許輸入的最大長度，默認為Number.MAX_VALUE。 說明： enforceMaxLength為false時，輸入超長會顯示錯誤提示。 enforceMaxLength為true時，輸入被限制在范圍內，不出現提示。 |
| maxLengthText | String | 最大長度驗證失敗后顯示的提示消息 |
| minLength | Number | 字段允許輸入的最小長度，默認為0 |
| minLengthText | String | 最小長度驗證失敗后顯示的提示消息 |
| regex | RegExp | 用於驗證的javascript正則表達式 |
| regexText | String | 正則表達式驗證失敗后顯示的提示消息，默認為空 |
| selectOnFocus | Boolean | 設置當字段得到焦點時是否字段選擇已存在的文本，默認為false |
| stripCharsRe | RegExps | 去除字符正則表達式，將在驗證前過濾不希望輸入的字符 |
| validator | Function | 自定義驗證函數，當前值將被傳入，驗證通過返回true，驗證失敗返回錯誤信息 |
| vtype | String | 驗證類型名字 |
| vtypeText | String | 自定義提示消息，用來代替vtype本身的錯誤提示消息 |
2、Ext.from.field.Text示例
代碼：
<!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.Panel</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 () { Ext.QuickTips.init(); var frmLogin = new Ext.form.Panel({ title: "Ext.form.field.Text示例", bodyStyle: "padding:5 5 5 5", height: 120, width: 200, frame: true, collapsible: true, renderTo: "form1", defaultType:"textfield", defaults: { labelSeparator: "：", labelWidth: 50, labelAlign: "left", width: 175, allowBlank: false, blankText: "必填", msgTarget: "side" }, items: [{ fieldLabel: "用戶名", name: "UserName", regex: /^([\w]+)(.[\w]+)*@([\w-]+\.){1,5}([A-Za-z]){2,4}$/, regexText: "格式錯誤" }, { fieldLabel: "密碼", name: "Password", inputType: "password" }], buttons: [{ text: "登錄", handler: function () { frmLogin.form.setValues({ UserName:"libingql@126.com", Password:"1" }) } }] }); }); </script> </head> <body> <form id="form1"> </form> </body> </html>
效果圖：
