在firefox中,如果校验失败是不会执行提交操作的;但是在IE中则会提交,需要用form.isValid()来判断。
在提交前调用判断是否数据校验OK:
//数据校验
if (!form.getForm().isValid()){
Ext.Msg.alert('信息','有些必输项未输入!');
return;
}
要想提示,需要把Ext.QuickTips.init();打开,否则看到的就是红色的波浪线,没文字提示。
20.1输入不能为空
继承自Ext.form.TextField的控件都支持非空校验,它们是:TextField、NumberField、TextArea、TriggerField、Combobox、DateField、TimerField。
举例:
var textfield = new Ext.form.TextField({
fieldLabel:"Username",
allowBlank:false,
emptyText:"请输入数据",
blankText:"此项为必输项!",
name:"username",
minLength:6,
maxLength:16
});
页面加载后输入框中提示“请输入数据”,如果没有输入数据,则在提交时或焦点离开输入框时提示“此项为必输项!”。
20.2限制输入长度
代码:
var textfield = new Ext.form.TextField({
fieldLabel:"Username",
allowBlank:false,
emptyText:"请输入数据",
blankText:"此项为必输项!",
name:"username",
minLength:6,
minLengthText:"最少输入6位!",
maxLengthText:"最多输入16位!",
maxLength:16
});
20.3借助Vtype验证
Ext提供了一套默认的验证方案,如果使用它们就只需要记住vtype即可,就不需要记住一长串的正则表达式了,然后在控件中配置即可。
例如:
var email = new Ext.form.TextField({
fieldLabel:"Email",
allowBlank:false,
emptyText:"请输入数据",
name:"email",
minLength:6,
maxLength:16,
vtype:"email"
});
这些信息定义在Ext.form.Vtype中,默认支持4种vtype:
1. email:电子邮件格式
2.url:网址
3.alpha:英文字母
4.alphanum:英文字母+数字
如果要扩展自己的vtype,可以这样:
Ext.apply(Ext.form.VTypes, {
IPAddress:function(v) {
return/^\d{1,3}\.\d{1,3}\.\d{1,3}\.\d{1,3}$/.test(v);
},
IPAddressText: 'Must be a numeric IP address'
});
这样就扩展了一种vtype:IPAddress。
这样使用就可以了:
var ip = new Ext.form.TextField({
fieldLabel:"Ip",
allowBlank:false,
emptyText:"请输入数据",
name:"ip",
minLength:6,
maxLength:16,
vtype:"IPAddress"
});
20.4自定义校验
其实上面扩展vtype也算是自定义校验规则。自定义校验就是允许使用regex来验证。
例如:
var hanzi = new Ext.form.TextField({
fieldLabel:"汉字",
allowBlank:false,
emptyText:"请输入数据",
name:"hanzi",
minLength:6,
maxLength:16,
regex:/^[\u4E00-\u9FA5]+$/,
regexText:"只能输入汉字!"
});
20.5后台校验
在后台返回的消息中,只要返回错误消息errors,并把它放到正确的地方,Ext会自动将错误信息显示到相应的位置。
示例:
// 后台校验
Ext.onReady(function() {
Ext.QuickTips.init();
var serverText = new Ext.form.TextField({
fieldLabel:"后台校验",
name:"houtai"
});
var form = new Ext.form.FormPanel({
title:"Ext默认表单提交方式",
width:800,
labelAlign:"right",
labelWidth:100,
url:'/myExt2.3/AjaxSubmitForm.do',
renderTo:document.body,
items:[
serverText
],
buttons:[
{
text:"提交",
handler:function() {
//数据校验
if (!form.getForm().isValid()) {
Ext.Msg.alert('信息','有些必输项未输入!');
return;
}
form.getForm().submit({
success: function(form,action) {
Ext.Msg.alert('提示',action.result.msg);
},
failure: function(form,action) {
//Ext.Msg.alert('提示','提交失败!');
if (action.failureType == Ext.form.Action.SERVER_INVALID) {// 业务错误
//Ext.Msg.alert('提示','提交失败!');
}
else { // 网络问题
Ext.Msg.alert('提示','网络连接故障!');
}
}
});
}
}
]
});
});
Servlet:
Stringhoutai = request.getParameter("houtai");
if(houtai.replace("","").length() == 0) {
response.getWriter().write("{success:false,errors:{houtai:'后台提示不能为空!'}}");
}
else {
response.getWriter().write("{success:true,msg:'表单提交成功!'}");
}
A. 不输入任何内容,单击提交按钮
这里的提示信息就是后台返回的提示信息,在Servlet返回的errors中定义的。
B. 输入内容,单击提交按钮、
相关推荐
ext_表单提交_数据校验 ext_表单提交_数据校验
Ext4 的日志校验功能可以很方便地判断日志数据是否损坏,而且它将 Ext3 的两阶段日志机制合并成一个阶段,在增加安全性的同时提高了性能。 9. “无日志”(No Journaling)模式。 日志总归有一些开销,Ext4 允许关闭...
EXT表单验证之TextField,vtype 包括所有EXT中TextField的验证方式
4.7.5. 算不上校验的NumberField 4.8. 关于表单内部控件的布局问题 4.8.1. 什么都不做,默认的平铺布局 4.8.2. 分裂,分列 4.8.2.1. 分裂,分列。1.x 4.8.2.2. 分裂,分列。2.0 4.8.3. fieldset是个神奇的东西 4.8.4...
1.2. 看看ext-2.0.2的文档 1.3. 为什么有的例子必须放在服务器上才能看到效果? 1.4. 为什么自己按照例子写的代码,显示出来总找不到图片 1.5. 我们还需要什么? 1.6. 入门之前,都看helloworld。 1.6.1. 直接使用...
三层体系的应用程序将业务规则、数据访问、合法性校验等工作放到了中间层进行处理。通常情况下,客户端不直接与数据库进行交互,而是通过COM/DCOM通讯与中间层建立连接,再经由中间层与数据库进行交互。 表示层 ...
重写 代码如下: //解决checkboxgroup回填数据问题 Ext.override(Ext.form.BasicForm,{ findField : function(id){ var field = this.items.get(id); if(!field){ this.items.each(function(f){ if(f.isXType(...
4.7.5. 算不上校验的NumberField 4.8. 关于表单内部控件的布局问题 4.8.1. 什么都不做,默认的平铺布局 4.8.2. 分裂,分列 4.8.2.1. 分裂,分列。1.x 4.8.2.2. 分裂,分列。2.0 4.8.3. fieldset是个神奇的东西...
里面主要封装了如下特性:数据库连接池(常用的4-5个)、分页查询(oracle,mysql,sqlserver等)、数据转码(空值、特定、列名等)、数据导出(Pdf,excel,html,rtf,xml等)、日志处理、启动jar加载校验机制、...
- 支持 FAT, NTFS, Ext2/3, ReiserFS, Reiser4, UFS, CDFS, UDF 文件系统 - 支持对磁盘阵列 RAID 系统和动态磁盘的重组、分析和数据恢复 - 多种数据恢复技术 - 可分析 RAW 格式原始数据镜像文件中的完整目录结构,...
今天带大家了解一下ext4的历史,包括其与ext3和之前的其它文件系统之间的区别 大多数现代Linux发行版默认为ext 4文件系统,就像以前的Linux发行版默认为ext3、ext2,以及-如果追溯到足够远的话-ext。 如果您是Linux...
2、可在用户停止输入后自动校验,避免频繁进行无谓的后台校验; 3、以插件方式实现,方便使用; 二、插件源码如下: /** * Created by jiawenjun on 2016/10/19. */ Ext.define('Ext.ux.plugins.FieldAjaxVerify',...
Serde是一个轻量级的通用框架,用于在Python中定义,序列化,反序列化和验证数据结构。 抽象模型 自定义标签 领域 模型状态和过程 执照 入门 安装 Serde在PyPI上可用,您可以使用安装 pip install serde 扩展...
支持 FAT, NTFS, Ext2/3, ReiserFS, Reiser4, UFS, CDFS, UDF 文件系统 硬盘, 软盘, CD-ROM 和 DVD, ZIP, Smart Media, Compact Flash, 等磁盘编辑器... 多种数据恢复技术 支持对磁盘阵列 RAID 系统和动态磁盘的重组...
支持FAT、NTFS、Ext2/3、ReiserFS、Reiser4、UFS、CDFS、UDF等文件系统 可支持重组RAID及动态磁盘 附带数据恢复功能 可以访问物理内存及虚拟内存 内置数据解释器,可以识别解释20种数据类型 可以用数据结构模板查看...
支持 FAT, NTFS, Ext2/3, ReiserFS, Reiser4, UFS, CDFS, UDF 文件系统 支持对磁盘阵列 RAID 系统和动态磁盘的重组、分析和数据恢复 多种数据恢复技术 可分析 RAW 格式原始数据镜像文件中的完整目录结构,...
'/assets/foo_wo_ext', 'foo_wo_ext'); } public function testConstructor() { $this->assertAttributeEquals('foo', 'name', $this->fileWithExtension); $this->assertAttributeEquals('...
Feed4JUnit能够让编写JUnit的参数化测试变得...利用Feed4JUnit能够很方便用随机但校验过的数据执行冒烟测试来提高代码 代码覆盖率和发现由非常特殊的数据结构产生的Bug。此外还可以利用Feed4JUnit轻松定义等价类测试。
- 支持 FAT, NTFS, Ext2/3, ReiserFS, Reiser4, UFS, CDFS, UDF 文件系统 - 支持对磁盘阵列 RAID 系统和动态磁盘的重组、分析和数据恢复 - 多种数据恢复技术 - 可分析 RAW 格式原始数据镜像文件中的完整目录结构...
- 支持 FAT, NTFS, Ext2/3, ReiserFS, Reiser4, UFS, CDFS, UDF 文件系统 - 支持对磁盘阵列 RAID 系统和动态磁盘的重组、分析和数据恢复 - 多种数据恢复技术 - 可分析 RAW 格式原始数据镜像文件中的完整目录结构,...