脚本宝典收集整理的这篇文章主要介绍了javascript代码实例教程-ExtJs4 表格输入时的有效性验证，脚本宝典觉得挺不错的，现在分享给大家，也给大家做个参考。小宝典致力于为广大程序猿（媛）提供高品质的代码服务，请大家多多光顾小站，小宝典在此谢过。
看到网上没有类似的demo 官方api又写的不太明确 , 就写了一个简单的例子分享一下 , 希望高手指点 帮忙改进~
一: 所需配置
1. Grid是单元格编辑模式
[javascript]
VAR cellEdITing = Ext.create('Ext.grid.plugin.CellEditing', {
id : "fxxxCellEditing",
clicksToEdit: 2//双击编辑
});
var cellEditing = Ext.create('Ext.grid.plugin.CellEditing', {
id : "fxxxCellEditing",
clicksToEdit: 2//双击编辑
});
[javascript]
selTyPE: 'cellmodel',
selType: 'cellmodel',
2. QuickTips用于悬浮显示错误信息
[javascript]
Ext.QuickTips.init();//错误悬浮提示
Ext.QuickTips.init();//错误悬浮提示3. Grid的每一个columns声明一个editor
[javascript]
columns: [
{
header: '<font color="red">*</font>功能',
dataindex: 'funName',
width: "10%",
align: 'center',
sortable: true,//是否可排序
editor:new Ext.form.TextField({
allowBlank: false,
blankText : "功能不能为空",
maxLength: 40,
maxLengthText : "长度不能超过40"
})
},
columns: [
{
header: '<font color="red">*</font>功能',
dataIndex: 'funName',
width: "10%",
align: 'center',
sortable: true,//是否可排序
editor:new Ext.form.TextField({
allowBlank: false,
blankText : "功能不能为空",
maxLength: 40,
maxLengthText : "长度不能超过40"
})
},
这个editor用Ext.form.TextField对象实现 ,
这样就可以在传参中写入验证的配置信息了.
二: 验证方式
1. 系统提供长度验证
这个长度是英文长度, 中文的话可以用后边的validator来数汉字的长度
[javascript]
editor:new Ext.form.TextField({
allowBlank: false,
blankText : "功能不能为空",
maxLength: 4,
maxLengthText : "长度不能超过4"
minLength:2,
minLengthText : "长度不能小于2",
editor:new Ext.form.TextField({
allowBlank: false,
blankText : "功能不能为空",
maxLength: 4,
maxLengthText : "长度不能超过4"
minLength:2,
minLengthText : "长度不能小于2",
2.正则表达式验证
[javascript]
editor:new Ext.form.TextField({
allowBlank: false,
blankText : "故障模式频数比不能为空",
regex :/^(0([/.]/d*[0-9]+)|0|1)$/, //==>此正则是[0,1] , 另"/0/.[0-9]*[1-9]$/"是(0,1)
regexText : "只能输入:数值范围在0到1之间的小数"
})
editor:new Ext.form.TextField({
allowBlank: false,
blankText : "故障模式频数比不能为空",
regex :/^(0([/.]/d*[0-9]+)|0|1)$/, //==>此正则是[0,1] , 另"/0/.[0-9]*[1-9]$/"是(0,1)
regexText : "只能输入:数值范围在0到1之间的小数"
})
3.form.TextField的 validator :配置验证
[javascript]
editor:new Ext.form.TextField({
allowBlank: false,
blankText : "功能不能为空",
validator : function( value )
{
var len = value.replace(/[^/x00-/xff]/g, "xx").length;
if( len > 4000 )
{
return '功能的长度不能超过4000字节，一个汉字字符为两个字节';
}
else
{
return true;
}
}
})
editor:new Ext.form.TextField({
allowBlank: false,
blankText : "功能不能为空",
validator : function( value )
{
var len = value.replace(/[^/x00-/xff]/g, "xx").length;
if( len > 4000 )
{
return '功能的长度不能超过4000字节，一个汉字字符为两个字节';
}
else
{
return true;
}
}
})
4.vtype自定义验证
这个相对复杂 ,我只用validator 就能完成验证了 时间比较紧就没研究 嘿嘿
大致用法如下
[javascript]
vtype : "email",//email格式验证
vtypeText : "不是有效的邮箱地址",//错误提示信息
vtype : "email",//email格式验证
vtypeText : "不是有效的邮箱地址",//错误提示信息
官方给了几个vtype
还可以通过
Ext.apply(Ext.form.field.VTypes, {
自己拓展
觉得可用，就经常来吧！ 脚本宝典 欢迎评论哦！ js脚本，巧夺天工，精雕玉琢。小宝典献丑了！
以上是脚本宝典为你收集整理的javascript代码实例教程-ExtJs4 表格输入时的有效性验证全部内容，希望文章能够帮你解决javascript代码实例教程-ExtJs4 表格输入时的有效性验证所遇到的问题。
本图文内容来源于网友网络收集整理提供，作为学习参考使用，版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ：384754419，请注明来意。