本章介紹Ext.form.TextField組件的基本用法:
<form id="form1" runat="server">
<div>
<div id="Bind_TextField"></div>
<br />
<div id="Bind_Button"></div>
<script type="text/javascript">
//這里是把TextField很重要的屬性列出來 實際在應用的時候不需要將每個屬性都列出 也許只需要一個屬性就夠了。
function ready()
{
Ext.QuickTips.init();
var textfieldName = new Ext.form.TextField
({
id:"textfieldName",
allowBlank:false,//默認是true,如果是false,就是不允許空
//假如不為空時,定義提示信息 默認的提示信息是:This field is required
//要使提示內容出現,需要添加 Ext.QuickTips.init();
blankText:"請輸入數據",
disabled:false,//默認是false
emptyText:"請正確輸入數據",//默認是null
fieldLabel:"用戶名稱",//默認是""
height:"auto",//默認是auto
hidden:false,//默認是false
hideLabel:false,//默認是false
hideMode:"offsets",//默認display,可以取值:display,offsets,visibility
inputType:"text",//輸入類型 這個很重要,可以是radio, text, password, file 默認是text
invalidText:"invalidText:只能夠輸入數字",//默認是:The value in this field is invalid
maxLength:100,//能夠輸入的內容的最大長度
maxLengthText:"輸入內容太長了",//超出最大長度的設置信息
minLength:2,//能夠輸入的內容的最小長度
maxLengthText:"輸入內容太短了",//沒有達到最小長度的設置信息
readOnly:false,//內容是否只讀,默認false
regex:/^\d$/, //正則表達式 這里假設只允許輸入數字 如果輸入的不是數字 就會出現下面定義的提示信息
regexText:"regexText:只能夠輸入數字", //定義不符合正則表達式的提示信息
validateOnBlur:true,//默認是true,失去焦點時驗證
validationDelay:300,//默認是250,驗證延遲時間,毫秒數
validationEvent:"click", //驗證事件 默認是keyup 可以是String/Boolean
//自定義的驗證函數 當輸入的數據不符合正則表達式的要求時,就會執行這個函數
validator:function(){Ext.Msg.alert("提示信息","只能夠輸入數字");},
value:"",//自定義的信息 默認是:undefined
//x:number,y:number,在容器中的x,y坐標
width:"auto",//默認是auto
renderTo:"Bind_TextField"
});
//TextField組件的方法和事件都比較簡單,具體請查看Ext2.2官方文檔,如果有不明白的地方在博客里提問解決
//以上就是TextField組件的常用定義。
}
Ext.onReady(ready);
</script>
</div>
</form>