`
chengyue2007
  • 浏览: 1488725 次
  • 性别: Icon_minigender_1
  • 来自: 大连
社区版块
存档分类
最新评论

ext的vtype自动验证

阅读更多

用vtype格式进行简单的验证。
在此举邮件验证的例子,重写上面代码的items配置:

items:[
               {fieldLabel:"不能为空",
                vtype:"email",//email格式验证
                vtypeText:"不是有效的邮箱地址",//错误提示信息,默认值我就不说了
                id:"blanktest",
                anchor:"90%"
               }

你可以修改上面的vtype为以下的几种extjs的vtype默认支持的验证:

//form验证中vtype的默认支持类型
1.alpha //只能输入字母,无法输入其他(如数字,特殊符号等)
2.alphanum//只能输入字母和数字,无法输入其他
3.email//email验证,要求的格式是"
langsin@gmail.com"
4.url//url格式验证,要求的格式是
http://www.langsin.com
3.确认密码验证(高级自定义验证)
前面的验证都是extjs已经提供的验证,我们也可以自定义验证函数,比上面要复杂点了。我们一起做一个密码确认的例子。
我们修改前面的代码:

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

 



 

 



 

  • 大小: 5.1 KB
分享到:
评论

相关推荐

    Ext 添加功能form表单实例

    4. **其他字段**: 除了上述字段外,还有名称、手机号和邮箱等字段,每个字段都有对应的验证规则,比如手机号必须符合特定格式(`vtype:"mphone"`),邮箱必须是有效的邮箱地址(`vtype:"email"`). #### 字段集 字段集...

    EXT2.0中文教程

    4.7.3. 借助vtype 4.7.4. 自定义验证规则 4.7.5. 算不上校验的NumberField 4.8. 关于表单内部控件的布局问题 4.8.1. 什么都不做,默认的平铺布局 4.8.2. 分裂,分列 4.8.2.1. 分裂,分列。1.x 4.8.2.2. 分裂,分列。...

    ext js mvc

    Vtype是Ext JS中的验证类型,用于在表单字段输入时进行实时验证。开发者可以定义或使用内置的vtypes,如email、url等,确保用户输入的数据符合预设格式。例如,为一个文本字段设置vtype="email",将自动检查输入...

    Ext 开发指南 学习资料

    4.7.3. 借助vtype 4.7.4. 自定义验证规则 4.7.5. 算不上校验的NumberField 4.7.6. 使用后台返回的校验信息 4.8. 关于表单内部控件的布局问题 4.8.1. 什么都不做,默认的平铺布局 4.8.2. 分裂,分列 4.8.3. fieldset...

    ext-3-TextField-sample.rar_ext_ext TextField_ext textfield inp

    - `vtype`: 验证类型,如email、url等,用于自动进行数据格式检查。 - `regex`: 正则表达式,自定义验证规则。 - `emptyText`: 输入框默认显示的提示文本,当输入框为空时显示。 3. **事件处理**: TextField...

    extjs表单验证特殊字符

    通过设置`allowBlank`、`blankText`和`regex`等属性,可以在用户离开字段时自动进行验证。 6. **错误提示**: EXTJS提供了丰富的错误提示机制,可以配置错误提示图标、提示文本和位置。对于特殊字符验证失败,可以...

    JS表单验证数字字母汉字邮箱.pdf

    为了显示错误提示,代码中使用了`regexText`属性自定义正则表达式验证失败时的提示信息,并通过`Ext.QuickTips.init()`初始化快速提示功能,使得鼠标悬停在红色警告标记上时可以显示提示信息。 总结来说,这个示例...

    Extjs页面验证

    首先,ExtJS提供了多种内置的验证方法和组件属性,例如`vtype`和`fieldValidator`,用于在用户提交表单前验证字段内容。`vtype`是预定义的验证类型,如邮箱、数字等,可以简单快速地设置字段的验证规则。例如,对于...

    extjs xtype

    EXTJS提供了多种预定义的`vtype`验证规则,如`email`(验证电子邮件格式)、`url`(验证URL格式)、`number`(验证数字)等。这些验证规则可以应用于`Ext.form.field.Field`的子类,如`Ext.form.TextField`,以确保...

    ExtJSWeb应用程序开发指南(第2版)

    4.2.2 表单验证(VType) 4.2.3 自定义VType验证 4.3 表单的提交和加载 4.3.1 Ext.form.action.Action基础 4.3.2 Ajax模式的表单数据加载 4.3.3 Ajax模式的表单数据提交 4.3.4 标准模式的表单数据提交 4.3.5 ...

    验证的正则表达式,开发提供参考

    - **vtype**: 字符串,自定义验证类型。 - **vtypeText**: 字符串,自定义验证类型失败时显示的提示信息。 - **validator**: 函数,自定义验证逻辑,默认为`null`。 以上配置项可以根据实际应用场景进行灵活调整,...

    extjs属性方法大全

    - `vtype`: 验证类型,如 `alpha`(字母)、`alphanum`(字母数字)、`email`、`url` 等。 - `vtypeText`: 验证失败时的错误提示。 - `validator`: 自定义验证器函数。 - **事件:** - `selectOnFocus`: 获取...

    extjs实践大量实例讲解

    网格中的每一列都绑定了相应的数据字段,实现了数据与视图的自动同步。 ### 示例 3:表单验证 ```javascript var form = Ext.create('Ext.form.Panel', { title: 'Basic Form', width: 300, bodyPadding: 10, ...

    extjs 时间范围选择自动判断的实现代码

    总结,EXTJS的时间范围选择自动判断通过自定义验证函数、设置日期选择器属性以及处理按钮事件来实现。这使得用户界面更加友好,有效地防止了无效的日期输入,并提供了实时的反馈。在EXTJS4.1.1版本中,上述代码可以...

    Extjs属性大全

    - **vtype**:自定义验证类型,例如: - `alpha`:只允许字母。 - `alphanum`:只允许字母和数字。 - `email`:电子邮件地址格式。 - `url`:URL地址格式。 - **vtypeText**:验证失败时显示的消息。 - **...

Global site tag (gtag.js) - Google Analytics