1

 1 Ext.onReady(function(){
 2
 3     Ext.QuickTips.init();
 4     //重写 (自定义)xtype
 5     Ext.apply(Ext.form.VTypes,{
 6         repetition:function(val,field){
 7             if(field.repetition){
 8                 var pass = Ext.getCmp(field.repetition.compareTo);
 9                 if(Ext.isEmpty(pass)){
10                     Ext.Msg.show({
11                         title:'Error',
12                         msg:'没有要对比的组件',
13                         icon:Ext.Msg.error,
14                         buttons:Ext.Msg.OK
15                     });
16                     //return;
17                 }
18                 if(val == pass.getValue()){
19                     return true;
20                 }else{
21                     return false;
22                 }
23             }
24         },
25         repetitionText:"两次输入的密码不一致"
26     });
27
28
29     //定义登录表单
30     var form = new Ext.form.FormPanel({
31         id:'loginform',
32         labelAlign:'right',
33         buttonAlign:'center',
34         frame:true,
35         monitorValid:true,
36         items:[{
37             xtype:'textfield',
38             fieldLabel:'姓名',
39             name:'username',
40             minLength:6,
41             allowBlank:false
42         },{
43             id:'password',
44             xtype:'textfield',
45             inputType:'password',
46             fieldLabel:'密码',
47             name:'password'
48         },{
49             id:'repasswda',
50             xtype:'textfield',
51             inputType:'password',
52             fieldLabel:'确认密码',
53             name:'compasswd',
54             vtype:"repetition",
55             repetition:{ compareTo: 'password' }
56
57         }],
58         buttons:[
59             {text:'提交',
60              handler:loginSubmit,
61              formBind:true
62             },
63             {text:'重置',
64              handler:function(){
65                  Ext.getCmp('loginform').getForm.reset();
66              }
67             }
68         ]
69     });
70     //表单定义结束
71
72     //提交表单是触发的函数
73     function loginSubmit(){
74         Ext.getCmp('loginform').getForm().submit({ //这里就把表单的值带过去了
75             url:'login.php',
76             success:function(form,action){
77                 //TODO 跳转到其他页面
78             },
79             failure:function(form,action){
80                 alert(action.result.msg);
81             }
82         });
83     }
84
85     //定义一个窗口
86
87     var win = new Ext.Window({
88         title:'用户登录',
89         layout:'fit',
90         width:300,
91         height:200,
92         closable:false,
93         resizable:false,
94         constrain:true,
95         items:[form]
96     });
97     win.show();
98 })

转载于:https://www.cnblogs.com/sharpest/p/7704289.html

95.Extjs 表单中自定义的验证规则 VTypes相关推荐

  1. ElementUI中form表单组件自定义手机号验证规则

    <el-form :model="ruleForm" status-icon :rules="rules" ref="ruleForm" ...

  2. vue使用element ui自定义手机验证规则

    1.表单的一项 <el-form-item label="电话" prop="senderPhone"><el-input v-model=& ...

  3. Django之使用自定义用户表(AbstractUser)/自定义登录验证(jwt)/获取当前登录用户

    基本步骤: 一.自定义用户表: 1.自定义的用户表继承AbstractUser: 2.settings.py添加配置,指向用户表:AUTH_USER_MODEL = 'myUser.Account'( ...

  4. 前端学习(1900)vue之电商管理系统电商系统之渲染添加用户的表单自定义邮箱的规则

    目录结构 router.js import Vue from 'vue' import Router from 'vue-router' import Login from './components ...

  5. iview form 表单 自定义参数验证 validate

    需求,使用的是iview框架的Form组件,一般简单input类型数据,使用简单的验证配置就可以达到效果.如官方的写法. iview 表单验证 地址 https://www.iviewui.com/c ...

  6. 【vue-upload】表单中自定义头像上传,或手动上传

    一.自定义上传 使用http-request实现自定义上传 <el-form-item prop="imageUrl" label="二维码:">& ...

  7. extjs表单中动态添加items

    items:[var exceptionNumber = 1;var exceptionHandling =new String;{xtype: 'fieldset',title: '异常处理',id ...

  8. validatebox自定义验证规则以及使用

    //===============jsp======state====//开启验证<script type="text/javascript"> ​​​​​​​yZ() ...

  9. web 表单自定义字段_带有自定义服务器字段验证的AJAX表单提交

    web 表单自定义字段 Overview 总览 This article presents a method for validating form data in a PHP script usin ...

  10. 后盾网lavarel视频项目---自定义验证和自定义验证规则

    后盾网lavarel视频项目---自定义验证和自定义验证规则 一.总结 一句话总结: 1.自定义验证就是用的自定义验证请求类:php artisan make:request AdminPost 2. ...

最新文章

  1. Java面试题及答案整理 140道( 2021年持续更新)
  2. GitHub 骚操作,个人页还能这么玩?
  3. tensorflow算法实战:普通的数据训练和迁移学习之后的数据训练进行图像的识别(包括前端页面)
  4. 信通院AI白皮书:硬核干货一文打尽,从技术流派到应用趋势【附下载】
  5. findcontours 崩溃
  6. myeclipse 10安装svn插件
  7. mysql自定义函数多参数_自定义mysql函数 - 无法传递参数
  8. Python API快餐教程(1) - 字符串查找API
  9. (王道408考研操作系统)第三章内存管理-第一节6-4:非连续分配管理方式之基本分页存储管理之两级页表
  10. 程序员怎样上元宇宙的车?
  11. 1、Fiddler的基本介绍
  12. 深入学习typedef和typename
  13. /bin、/sbin、/usr/bin、/usr/sbin目录的区别
  14. 每次开机都要选择Windwos10才能进系统的原因及解决方法-- 【亲测有效】
  15. netbeans 8 java自动提示_Netbeans 代码提示
  16. 读书笔记: Cartesian Impedance Control of Redundant and Flexible-Joint Robots, Section 1
  17. 【区块链】开源社区发力区块链,超级账本会成就Linux一样的传奇吗?
  18. 全景图像拼接(一)关于全景拼接论文推荐
  19. 全国职称计算机应用能力考试6,全国职称计算机应用能力考试.doc
  20. dble配置mysql主从同步

热门文章

  1. 系统虚拟化与虚拟机的区别
  2. DrawText如何使多行文字居中
  3. 智能优化算法:人工电场优化算法-附代码
  4. 基于AE+C#的栅格IDW插值的实现
  5. numpy的广播机制
  6. 遥感影像单波段辐射定标处理
  7. 研究城市空间结构的入门级文献及书籍推荐(待更新)
  8. 题目:有1、2、3、4个数字,能组成多少个互不相同且无重复数字的三位数?都是多少?
  9. 使用序列标注方法进行关系抽取的相关论文推荐
  10. jsp过滤器一点小结