extjs正则验证

前端之家收集整理的这篇文章主要介绍了extjs正则验证前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

//表单验证 extjs默认几种
alpha只输入英文字
alphanum只能输入字母 和 数字
email电子邮件
url网址
-----------------------------
{
id:'userName',
name : 'userName',
fieldLabel : '帐号',
vtype:"email",//email格式验证
vtypeText:"不是有效的邮箱地址",//错误提示信息
blankText : '帐号不能为空'
}


------------------------------
minValue 和maxValue输入数字范围
allowDecimals不能输入小数点
allowNegative不能输入负数


=====
regex:/^\d$/,//正则表达式 这里假设只允许输入数字 如果输入的不是数字 就会出现下面定义的提示信息
regexText:"regexText:只能够输入数字",//定义不符合正则表达式的提示信息
validateOnBlur:true,//默认是true,失去焦点时验证
validationDelay:300,//默认是250,验证延迟时间,毫秒数
validationEvent:"click",//验证事件 默认是keyup 可以是String/Boolean

//自定义的验证函数 当输入的数据不符合正则表达式的要求时,就会执行这个函数
validator:function(){Ext.Msg.alert("提示信息","只能够输入数字");},
=====


# new Ext.form.NumberField({
#style:'direction:rtl'//这样就可以让输入框的光标定位在右边了.这就是你要的效果:)
# });


//正则表达式验证在EXTJS中的应用
regex: /^[a-zA-Z0-9_\u4e00-\u9fa5]+$/,
regexText: '格式应由汉字、数字、字母或下划线组成.'


文本框
maxLength: 5,//验证最大输入字符数
maxLengthText: "长度不多于5个字符!",

//minLength: 2,//验证最小输入字符数
//minLengthText: "评论人长度不少于2个字符!",218)">
-------------------------------
使用正则表达式验证
regex : /[\u4e00-\u9fa5]/,//正则表达式 [\u4e00-\u9fa5] : 只能输入中文


高级自定义密码验证:
//先用Ext.apply方法添加自定义的password验证函数(也可以取其他的名字)
Ext.apply(Ext.form.VTypes,{
//val指这里的文本框值,field指这个文本框组件
//confirmTo是我们自定义的配置参数,一般用来保存另外的组件的id值
password:function(val,field){
if(field.confirmTo){
//取得confirmTo的那个id的值
var pwd=Ext.get(field.confirmTo);
return (val==pwd.getValue());
}
return true;
}
});
------------
items:[{
fieldLabel:"密码",
id:"pass1",
},{
fieldLabel:"确认密码",
id:"pass2",
vtype:"password",//自定义的验证类型
vtypeText:"两次密码不一致!",
confirmTo:"pass1",//要比较的另外一个的组件的id
}


-------------------------------------------------------------------
draggable:true,是否允许拖动
constrain:true,限制窗口的整体
constrainHeader:true,窗口的顶部不能超越浏览器边界
plain: true,//渲染窗口的背景颜色
resizable:false,//鼠标是否可以任意拖动窗口的大小
border:true,//窗口内的边框
minimizable:true,//是否有最小化 按钮
maximizable:true,//是否有max 按钮
loadMask:"正在加载......",
closable:true,//是否有close 按钮
closeAction:'close',//点击关闭 触法closeActionhide:是将window隐藏,
"close",关闭window就将它从内存中撤销


Ext.window的closeAction有两种选择close/hide(完全关闭/隐藏)
close就是把此window destroy (默认) 如果使用默认,点击关闭窗口就把窗口对象销毁
这样就不能使用show()
closeAction:'hide'

5.如果需要定义控件有两种方法(以gridPanel为例子)
A:new Ext.grid.GridPanel({
})
B:{
xtype:’gridpanel’,
}
使用new 的方式是立即创建组件 而使用xtype则是延迟创建 这样的好处是当需要渲染此组件时才创建
类似hibernate的延迟加载 都是为了提高效率!

6.在JS中把JSON字符串转为对象,Ext.decode ( )
在JS中把对象转为JSON字符串,Ext.encode ( )

7.可以在容器组件中把hideLabels设置为true,这样将不会显示容器中字段的标签

8.年龄随着出生日期改变
{
xtype:"datefield",
format:"Y-m-d",//格式化日期,默认:'m/d/Y'
value:"1981-10-15",
readOnly:true,//设为只读
fieldLabel:"出生日期",
listeners:{
"blur":function(_df){//监听失去焦点事件,年龄随着出生日期改变
var _age = _df.ownerCt.findByType("textfield")[1];
_age.setValue(new Date().getFullYear() - _df.getValue().getFullYear() + 1);
}
}
}
-----------------------------------------------
第一种handler:
//document.body == Ext.getBody().dom
Ext.onReady(function(){
new Ext.Button({
renderTo:Ext.getBody(),//属性renderTo:将当前对象所生成的HTML对象存放到指定的对象中
text:"确 定",
handler:function(){//函数handler:指定一个函数句柄,默认触发click事件
Ext.Msg.alert("提示","欢迎学习ExtJS。");
//alert("欢迎学习ExtJS。");
}
});
});
第二种listeners:
Ext.onReady(function(){
new Ext.Button({
renderTo:Ext.getBody(),
text:"确 定",
listeners:{//函数listeners:在对象初始化之前就将一系列事件进行定义
"click":function(){
Ext.Msg.alert("提示","欢迎学习ExtJS。");
}
}
});
});
第三种on:
Ext.onReady(function(){
var _btn = new Ext.Button({
renderTo:Ext.getBody(),
text:"确 定"
});
_btn.on("click",function(){
Ext.Msg.alert("提示","欢迎学习ExtJS。");
});
});


《》从gridpanel中获取一行数据填充到表单中

grid.on('click',function(){
var selections = grid.getSelectionModel().getSelections();
for(var i = 0;i <selections.length ; i++){
var record = selections[i];
formPanel.getForm().loadRecord(record);
winP.show();
}}
});

猜你在找的正则表达式相关文章