ExtJS4-数据验证

短命女 2022-07-13 00:10 176阅读 0赞

例子：

<script type="text/javascript">  Ext.onReady(function(){ Ext.create('Ext.form.Panel', { frame: true, title: 'Form Fields Validation', width: 340, bodyPadding: 5, renderTo: 'myForm', fieldDefaults: { labelAlign: 'left', labelWidth: 90, anchor: '100%', //错误提示显示在下方，还可以配置为side、title、none msgTarget: 'under' }, items: [{ xtype: 'textfield', name: 'textfield1', fieldLabel: '必须输入', //不允许为空验证 allowBlank: false //1 },{ xtype: 'textfield', name: 'textfield2', fieldLabel: '知道两个字符', //输入的字符长度验证（至少输入2个字符） minLength: 2 //2 },{ xtype: 'textfield', name: 'textfield3', fieldLabel: '最长5个字符', //输入的字符长度验证（最多输入2个字符） maxLength: 5 //3 },{ xtype: 'textfield', name: 'textfield7', fieldLabel: '正则表达式验证电话号码', //通过正则表达式验证 regex: /^\d{3}-\d{3}-\d{4}$/, //4 regexText: 'Must be in the format xxx-xxx-xxxx' },{ xtype: 'textfield', name: 'textfield4', fieldLabel: '验证用户输入的是否为email', //已经定义好的验证，请通过文档查看vtype vtype: 'email' //5 },{ xtype: 'textfield', name: 'textfield6', fieldLabel: '验证用户输入的是否是URL', vtype: 'url' //8 }] }); }); </script>

效果图：  
![SouthEast][]

[SouthEast]: /images/20220713/91f59e72105d437d9663281ecd2379d6.png

发表评论取消回复

表情：

评论列表（有 0 条评论，176人围观）

还没有评论，来说两句吧...

相关阅读

相关 ExtJS4 toolbar布局

效果图： ![Center][] tbar : \[ '->',\{ xtype : 'combobox', displayField : 'value'

落日映苍穹つ/ 2022年09月25日 08:24/ 0 赞/ 209 阅读

相关 ExtJS4-Ext.Direct

在上一节中，我们介绍了ExtJS 中的服务器段数据代理，在介绍到Direct 代理的时候，我们提到了Ext.Direct。这一节我们将重点介绍Ext.Direct的具体用法，并

不念不忘少年蓝@/ 2022年09月23日 10:54/ 0 赞/ 344 阅读

相关 extjs 表单验证实例

//放在onReady的function（）\{\}中 Ext.QuickTips.init(); //为组件提供提示信息功能，

港控/mmm°/ 2022年09月20日 12:36/ 0 赞/ 167 阅读

相关 ExtJS 4 MVC架构讲解 – ExtJS4中文教程

ExtJS MVC架构讲解本文地址 [http://www.showframework.com/2012/07/extjs-mvc-architecture/][

短命女/ 2022年08月02日 00:17/ 0 赞/ 191 阅读

相关 ExtJS4 组件收缩

效果图： ![Center][] Ext.define('V5.test.view.Viewport', \{ extend : 'Ext.container.V

以你之姓@/ 2022年07月17日 03:20/ 0 赞/ 154 阅读

相关 ExtJS4-数据验证

例子： <script type="text/javascript">  Ext.onReady(function(){ E

短命女/ 2022年07月13日 00:10/ 0 赞/ 177 阅读

相关 Extjs form 验证器

items: \[\{ name: 'guestName', anchor: '60%', xtype: 'textfield', fieldLabel: '评论人', //验

Bertha 。/ 2022年07月10日 06:57/ 0 赞/ 262 阅读

相关 Hello ExtJs4.1

第一个ExtJs4.1，搞了半天总算搞出来鸟，开心。。直接上代码： <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//E

你的名字/ 2022年05月08日 19:42/ 0 赞/ 174 阅读

相关 extjs4图表--折线图

本篇文章将介绍extjs中自带的图表在本次案例中，提供一下功能： 1.从后端请求数据并运用到图表中，形成动态数据。 2.查询出每年各个月中人数。请看下面代

比眉伴天荒/ 2021年09月14日 13:00/ 0 赞/ 438 阅读

相关 extjs 重复验证

{ xtype: 'textfield', fieldLabel: 'Field', allowBlank: false,

快来打我*/ 2021年09月10日 07:10/ 0 赞/ 281 阅读