extjs4 在验证上面支持的也特别好,他可以使用自带的格式验证,也可以自定义验证

比如:正则验证,密码重复填写对比验证,以及 调用后台方法验证,下面将验证方法统一写出以供参考

function loginNameValidator(value, userId){
/********** 登录名唯一验证 **********/
var flag = true; var parameters = {
"loginUser.userName": value,
"loginUser.userId": userId
}
Ext.Ajax.request({
url: "dosomething",
method: "post",
params: parameters,
async: false,//必须为同步
success: function(response, config){//message:true 验证成功,message:false 验证失败
var resultJson = Ext.JSON.decode(response.responseText);
flag = resultJson.message;
console.log(flag);
}
});
return flag;
} Ext.onReady(function() {
var insertUserForm = Ext.create('Ext.form.Panel', {
bodyPadding : 5,
width : 400,
height: 300,
url : 'javaScript:void(0)',
bodyPadding: 20,
layout : 'anchor',
buttonAlign : 'center',
defaultType : 'textfield',
renderTo: Ext.getBody(),
defaults: {
anchor: '100%'
},
items : [
{
fieldLabel : '登录名',
labelWidth: 60,
name : 'userName',
allowBlank : false,
blankText : "登录名不能为空",
regex: /^[A-Za-z0-9]{3,12}$/,
regexText: "只能为3-12的位字母或数字",
validateOnChange: false, //失去焦点时才进行验证
validator: function(value){
var userIdField = Ext.get("userId");
if(userIdField != null){
var userId = userIdField.getValue();
var result = loginNameValidator(value,userId);
return result;
}
}
}, {
fieldLabel : '密   码',
labelWidth: 60,
name : 'password',
inputType: 'password',
allowBlank : false,
blankText : '密码不能为空',
regex : /^[\w@#]{4,15}$/,
regexText:"密码为4-15位的字母数字@#_等字符" },{
fieldLabel : '确认密码',
labelWidth: 60,
inputType: 'password',
name : 'confirmPassword',
allowBlank : false,
validator: function(value){
var password = this.previousSibling().value;
if(value != password){
return '两次输入的密码不一致';
}else{
return true;
}
}
},{//userId 隐藏域
id: "userId",
//fieldLabel: "用户ID",
hidden: false,
name: "userId"
}],
buttons : [{
text : '重置',
handler : function() {
this.up('form').getForm().reset();
}
}, {
text : '保存',
formBind : true,
disabled : true,
handler : function() {
var form = this.up('form').getForm();
if (form.isValid()) {
form.submit( {
success : function(form, action) {
Ext.Msg.alert('保存成功', action.result.msg);
},
failure : function(form, action) {
Ext.Msg.alert('操作失败', action.result.msg);
}
});
}
}
}]
});
});

extjs4 表单验证自定义的更多相关文章

  1. atittit.表单验证的实现方式以及原理本质以及选型以及自定义兼容easyui dsl规则的表单验证

    atittit.表单验证的实现方式以及原理本质以及选型以及自定义兼容easyui dsl规则的表单验证 1. 需求,表单验证需要弹框式,但目前easyui ms绑定死了tooltip式样 1 2. 表 ...

  2. jQuery Validate 表单验证插件----自定义一个验证方法

    一.下载依赖包 网盘下载:https://yunpan.cn/cryvgGGAQ3DSW  访问密码 f224 二.引入依赖包 <script src="../../scripts/j ...

  3. jQuery Validate 表单验证插件----自定义校验结果样式

    一.下载依赖包 网盘下载:https://yunpan.cn/cryvgGGAQ3DSW  访问密码 f224 二.引入依赖包 <script src="../../scripts/j ...

  4. easyui 表单验证validatetype——支持自定义验证

    easyui 的validatebox()提供了自定义验证的方法,为此我把一些常用的数据验证汇总了一下,代码如下: 代码 Code highlighting produced by Actipro C ...

  5. layui 自定义表单验证的几个实例

    *注:使用本方法请先引入layui依赖的layu.js和layui.css 1.html <input type="text" name="costbudget&q ...

  6. python26:自定义form表单验证

    一.自定义Form的原理 1.1 各种form表单验证比较 只有python提供了form表单验证,其他的都没有提供.django提供的功能还不够强大.最强大的是微软的ASP.NET!我们可以自己写一 ...

  7. jQuery基础(常用插件 表单验证,图片放大镜,自定义对象级,jQuery UI,面板折叠)

    1.表单验证插件——validate   该插件自带包含必填.数字.URL在内容的验证规则,即时显示异常信息,此外,还允许自定义验证规则,插件调用方法如下:   $(form).validate({o ...

  8. element自定义表单验证

    element-ui框架下修改密码弹窗进行表单验证. 除了基础校验,密码不为空,长度不小于6字符,需求中还需校验密码由数字和字母组合. 处理代码如下: <el-dialog :visible.s ...

  9. ElementUI使用问题记录:设置路由+iconfont图标+自定义表单验证

    一.关于导航怎么设置路由 1.在el-menu这个标签的属性中添加 router ,官方文档的解释是:启用vue-router 这种模式 2.在el-menu-item标签中的index属性直接书写路 ...

随机推荐

  1. HTTP 学习笔记02

    请求行 格式:请求方式  资源路径  HTTP版本号 HTTP1.1 还需要 [host] 例:GET   /test.html   HTTP/1.0 GET   /test.html   HTTP/ ...

  2. 充气娃娃什么感觉?Python告诉你

    上期为大家介绍了requests库的基本信息以及使用requests库爬取某东的商品页,收到了很多同学的反馈说期待猪哥的更新,猪哥感到非常开心,今天就带大家来玩一把刺激的! 一.需求背景 在实际开发过 ...

  3. Git使用小技巧之Stash命令藏储零乱分支

     想要获取更多文章可以访问我的博客 - 代码无止境. 在开发的过程中可能会经常出现下面这种情况,我们正在开发某个功能,当前分支的内容比较乱,不太适合提交,而此时我们需要切换到其他分支上处理一些事情.这 ...

  4. Windows下GIT的使用方法

    文章引用自:Git使用教程    https://www.cnblogs.com/tugenhua0707/p/4050072.html 本文章只限用于Windows,敬请参考 注意:操作命令纯属手敲 ...

  5. springboot定时任务之旅

    springboot定时任务 假设场景:单体应用的定时任务,假设我们已经有了一个搭建好的springboot应用,但是需要添加一个定时执行的部分(比如笔者遇到的是定时去请求一个接口数据来更新某个表), ...

  6. k8s学习 - 概念 - Deployment

    k8s学习 - 概念 - Deployment 有了 ReplicaSet 还需要有 Deployment 的原因是希望有一个控制器能管理部署更新时候的版本控制问题.一个 Deployment 可以管 ...

  7. VS2012 BIDS之Reporting Service/SSRS 项目2--开发过程问题总结(全)

    由刚开始的接触到现在做出来一个基本完整的SSRS的项目,学到了比较多的知识,和大家共享. 上一篇学习总结可能有些问题,一起修正和总结. ================================ ...

  8. 5G VS WiFi6,实力大比拼!

    移动通信与WiFi,就像移动设备上的两大高手.彼此势均力敌:一个主室内,一个主室外.WiFi是移动网络的室内覆盖补充,也承担着大量的数据流量卸载,二者既想各自占山为王,但也时不时地相互成全对方. 然而 ...

  9. Java多线程下载器FileDownloader(支持断点续传、代理等功能)

    前言 在我的任务清单中,很早就有了一个文件下载器,但一直忙着没空去写.最近刚好放假,便抽了些时间完成了下文中的这个下载器. 介绍 同样的,还是先上效果图吧. Jar包地址位于 FileDownload ...

  10. React的Context的使用方法简介

    context 定义: Context提供了一种方式,能够让数据在组件树中传递,而不必一级一级手动传递. API : createContext(defaultValue?). 使用方法: 首先要引入 ...