|
<script type="text/javascript"> Ext.onReady(function(){ Ext.QuickTips.init();// 浮動信息提示 Ext.form.Field.prototype.msgTarget = 'side';// 設(shè)置控件的錯誤信息顯示位置,主要可選的位置有:qtip,title,under,side,[elementId] var panel = new Ext.form.FormPanel({ renderTo:document.body, title:'formPanel', frame:true, //渲染背景顏色 labelWidth : 60, //顯示的標簽寬度為45 labelAlign : "right", //標簽內(nèi)容右對齊 bodyStyle:'padding:2px 10px 10px 2px', //使內(nèi)部元素和邊框 有一定距離 width:600, defaults: { autoFitErrors: "false", labelSeparator: ":", labelWidth: 50, width: 150, allowBlank: false, blankText: "必填", msgTarget: "qtip" }, items:[{ xtype:'textfield', id:'name', allowBlank:false, //默認是true 設(shè)置為false則不允許為空 //要使提示內(nèi)容出現(xiàn),需要添加 Ext.QuickTips.init(); blankText:'請輸入數(shù)據(jù)', disabled:false, //默認是false emptyText:'請輸入正確的數(shù)據(jù)',//默認是null fieldLabel:'用戶名',// height:'auto',//默認是auto hidden:false,//默認是false hiddenLabel:false,// 默認是false hideMode:"offsets",//默認display,可以取值:display,offsets,visibility // inputType:"text",//輸入類型 這個很重要,可以是radio, text, password, file 默認是text invalidText:"invalidText:只能夠輸入數(shù)字",//默認是:The value in this field is invalid maxLength:100,//能夠輸入的內(nèi)容的最大長度 maxLengthText:"輸入內(nèi)容太長了",//超出最大長度的設(shè)置信息 minLength:2,//能夠輸入的內(nèi)容的最小長度 minLengthText:"輸入內(nèi)容太短了",//沒有達到最小長度的設(shè)置信息 readOnly:false,//內(nèi)容是否只讀,默認false regex: /^\d+$/, //正則表達式 這里假設(shè)只允許輸入數(shù)字 如果輸入的不是數(shù)字 就會出現(xiàn)下面定義的提示信息 regexText:"regexText:只能夠輸入數(shù)字", //定義不符合正則表達式的提示信息 validateOnBlur:true,//默認是true,失去焦點時驗證 validationDelay:300,//默認是250,驗證延遲時間,毫秒數(shù) validationEvent:"keyup", //驗證事件 默認是keyup 可以是String/Boolean //自定義的驗證函數(shù) 當輸入的數(shù)據(jù)不符合正則表達式的要求時,就會執(zhí)行這個函數(shù) validator:function(){ Ext.Msg.alert("提示信息","只能夠輸入數(shù)字"); }, } ], buttons:[{ text:'重新加載性別', handler:function(){ Ext.getCmp('gender').getStore().load(); } },{ text:'設(shè)置男', handler:function(){ Ext.getCmp('gender').setValue('1'); //提交的值 Ext.getCmp('gender').setRawValue('men'); //設(shè)置顯示的值 } },{ text:'取值', handler:function(){ alert(Ext.getCmp('gender').getValue( )) } }] }); }); </script>
|