<script type="text/javascript"> Ext.onReady(function(){ Ext.QuickTips.init();// 浮動(dòng)信息提示 Ext.form.Field.prototype.msgTarget = 'side';// 設(shè)置控件的錯(cuò)誤信息顯示位置,主要可選的位置有:qtip,title,under,side,[elementId] var panel = new Ext.form.FormPanel({ renderTo:document.body, title:'formPanel', frame:true, //渲染背景顏色 labelWidth : 60, //顯示的標(biāo)簽寬度為45 labelAlign : "right", //標(biāo)簽內(nèi)容右對(duì)齊 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, //默認(rèn)是true 設(shè)置為false則不允許為空 //要使提示內(nèi)容出現(xiàn),需要添加 Ext.QuickTips.init(); blankText:'請(qǐng)輸入數(shù)據(jù)', disabled:false, //默認(rèn)是false emptyText:'請(qǐng)輸入正確的數(shù)據(jù)',//默認(rèn)是null fieldLabel:'用戶名',// height:'auto',//默認(rèn)是auto hidden:false,//默認(rèn)是false hiddenLabel:false,// 默認(rèn)是false hideMode:"offsets",//默認(rèn)display,可以取值:display,offsets,visibility // inputType:"text",//輸入類型 這個(gè)很重要,可以是radio, text, password, file 默認(rèn)是text invalidText:"invalidText:只能夠輸入數(shù)字",//默認(rèn)是:The value in this field is invalid maxLength:100,//能夠輸入的內(nèi)容的最大長度 maxLengthText:"輸入內(nèi)容太長了",//超出最大長度的設(shè)置信息 minLength:2,//能夠輸入的內(nèi)容的最小長度 minLengthText:"輸入內(nèi)容太短了",//沒有達(dá)到最小長度的設(shè)置信息 readOnly:false,//內(nèi)容是否只讀,默認(rèn)false regex: /^\d+$/, //正則表達(dá)式 這里假設(shè)只允許輸入數(shù)字 如果輸入的不是數(shù)字 就會(huì)出現(xiàn)下面定義的提示信息 regexText:"regexText:只能夠輸入數(shù)字", //定義不符合正則表達(dá)式的提示信息 validateOnBlur:true,//默認(rèn)是true,失去焦點(diǎn)時(shí)驗(yàn)證 validationDelay:300,//默認(rèn)是250,驗(yàn)證延遲時(shí)間,毫秒數(shù) validationEvent:"keyup", //驗(yàn)證事件 默認(rèn)是keyup 可以是String/Boolean //自定義的驗(yàn)證函數(shù) 當(dāng)輸入的數(shù)據(jù)不符合正則表達(dá)式的要求時(shí),就會(huì)執(zhí)行這個(gè)函數(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>
|