extjs 提交表单给php,Extjs表单常见验证小结_extjs
//放在onReady的function(){}中
Ext.QuickTips.init(); //为组件提供提示信息功能,form的主要提示信息就是客户端验证的错误信息。
Ext.form.Field.prototype.msgTarget='side'; //提示的方式,枚举值为:
qtip-当鼠标移动到控件上面时显示提示;
title-在浏览器的标题显示,但是测试结果是和qtip一样的;
under-在控件的底下显示错误提示;
side-在控件右边显示一个错误图标,鼠标指向图标时显示错误提示. 默认值;
id-[element id]错误提示显示在指定id的HTML元件中
1.一个最简单的例子:空验证
//空验证的两个参数
allowBlank:false//false则不能为空,默认为true
blankText:string//当为空时的错误提示信息
js代码为:
var form1 = new Ext.form.FormPanel({
width:350,
renderTo:"form1",
title:"FormPanel",
defaults:{xtype:"textfield",inputType:"password"},
items:[
{fieldLabel:"不能为空",
allowBlank:false, //不允许为空
blankText:"不能为空", //错误提示信息,默认为This field is required!
id:"blanktest",
}
]
});
2.用vtype格式进行简单的验证。
在此举邮件验证的例子,重写上面代码的items配置:
items:[
{fieldLabel:"不能为空",
vtype:"email",//email格式验证
vtypeText:"不是有效的邮箱地址",//错误提示信息,默认值我就不说了
id:"blanktest",
anchor:"90%"
}
你可以修改上面的vtype为以下的几种extjs的vtype默认支持的验证:
//form验证中vtype的默认支持类型
1.alpha //只能输入字母,无法输入其他(如数字,特殊符号等)
2.alphanum//只能输入字母和数字,无法输入其他
3.email//email验证,要求的格式是""
4.url//url格式验证,要求的格式是http://www.baidu.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",
},{
fieldLabel:"确认密码",
id:"pass2",
vtype:"password",//自定义的验证类型
vtypeText:"两次密码不一致!",
confirmTo:"pass1",//要比较的另外一个的组件的id
}
4.使用正则表达式验证
new Ext.form.TextField({
fieldLabel : "姓名",
name : "author_nam",
regex : /[\u4e00-\u9fa5]/, //正则表达式在/...../之间. [\u4e00-\u9fa5] : 只能输入中文.
regexText:"只能输入中文!", //正则表达式错误提示
allowBlank : false //此验证依然有效.不许为空.
本文原创发布php中文网,转载请注明出处,感谢您的尊重!
extjs 提交表单给php,Extjs表单常见验证小结_extjs相关推荐
- extjs 提交表单给php,JavaScript_Extjs学习笔记之二 初识Extjs之Form,Extjs中的表单组件是Ext.form.Basic - phpStudy...
Extjs学习笔记之二 初识Extjs之Form Extjs中的表单组件是Ext.form.BasicForm,不过最简单最常用的是Ext.form.FormPanel控件,它继承自Panel,具有一 ...
- ExtJs 第二章,Ext.form.Basic表单操作
1.认识Ext.form.Panel表单面板 Ext.form.field.CheckBox 复选框 checkboxfield Ext.form.CheckBoxGroup 复选框组 ...
- extjs 表单设置html5,ExtJS 配置和表格控件使用
ExtJS是一套完整的RIA解决方案,也因为功能完整造成了ext-all.js有400多k,由于是基于JS和CSS的功能实现,对客户端机器性能也有一定的要求,即不支持IE6以下的版本.如果您的项目对网 ...
- python表单提交的两种方式_Flask框架学习笔记之表单基础介绍与表单提交方式
本文实例讲述了Flask框架学习笔记之表单基础介绍与表单提交方式.分享给大家供大家参考,具体如下: 表单介绍 表单是HTML页面中负责数据采集功能的部件.由表单标签,表单域和表单按钮组成.通过表单,将 ...
- asp.net接受表单验证格式后再提交数据_如何解析 el-form-renderer 表单渲染器1.14.0...
DEEPEXI 大前端 常人道,一入开发深似海,技术学习无止境.在新技术层出不穷的前端开发领域,有一群身怀绝技的开发,他们在钻研前沿技术的同时,也不忘分享他们的成果,回馈社区.下面,就由小水滴带大家看 ...
- Vant-UI 表单组件(Field组件):验证表单元素表单提交 - 踩坑篇
Vant-UI 表单组件(Field组件):验证表单元素&&表单提交: 示例截图 · 如下: 示例 · 详细代码 · 如下: <template><div class ...
- 简单表单提交php教程,php教程之表单提交实例
一个超简单的初学者用的php教程之表单提交实例有需要的朋友参考一下. 下面我们将创建一个复杂的表单,代码如下所示. 实例代码如下: 姓名: 密码: 年龄: 16">小于16 16-30 ...
- ajax提交成功清空表单,Ajax提交数据后,清空form表单
按钮不同,页面相同,还需要显示的数据不同,这里会由于页面的缓存问题,导致,每次点开这个页面显示的数据相同. 这不是我们想要的.这就需要清楚表单数据了. 如下: $('#myform')[0].rese ...
- JS表单的获取、表单元素的获取、提交表单
获取表单 document.getElementById("id属性值"),通过表单的id属性值获取属性对象 document.表单的name属性值,通过表单的name属性值获取表 ...
最新文章
- Invalid Host header 问题解决
- 范进中举,读个博士到底有多难?看看就知道了!
- Poj(2240),Floyd求汇率是不是赚钱
- 【转载】ceph作为OpenStack的后端存储解决方案
- 电脑越来越慢怎么办_电脑维修|你的电脑肯定遇到过这些故障
- 如何监控和提高IIS的性能
- [pytorch、学习] - 5.5 卷积神经网络(LeNet)
- bp神经网络预测_股指期货价格变动趋势往往反映的是股票价格的走势,因此BP神经网络对股指期货价格的准确预测就是对股票价格的准确预测。...
- u盘被保护怎样解除?(第十招)
- uva 11396Claw Decomposotion(二分图判定)
- 简单解决新浪博客“您短时间发表文章过多,请稍后再试”的问题
- matlab multisim,清华大学出版社-图书详情-《仿真软件教程——Multisim和MATLAB》
- 【SysML精粹】系统建模语言概览
- php集成环境总结(php新手)
- java–转换文件编码
- 2、数码相框之显示文字
- 图benchmark
- python数学公式编辑工具_Karl的良心佳软推荐 篇二:目前最好用的数学公式编辑神器——Mathpix Snipping Tool...
- image could not be accessed on a registry to record its digest
- 网站上做企业微信扫码授权登录怎么做?(超详细教程)
热门文章
- 真会省钱!苹果iPhone SE3首拆:电池、内存容量揭晓、基带属实缩水
- 京东11.11晚8开启四小时累计售出商品超1.9亿件
- 瑞幸咖啡上半年营收31.8亿元 同比增长106%
- 一加9RT外观和部分参数揭晓:搭载骁龙888+E4直屏
- 苹果再因“降频门”遭遇集体诉讼,11.5万用户出拳
- 在吗,支付宝土味情歌撩到你了吗?网友:撩到了,好酸
- 华为nova 8 Pro王者荣耀定制版曝光:内置小鲁班定制主题 电池盖镭雕小鲁班
- 百度Apollo无人驾驶路测更进一步 李彦宏感慨:终于可以不用安全员了
- 苹果推出雷雳 3 Pro连接线:黑色编织设计 售价949元
- 淘宝双12趣味大数据:150万件打底裤被男人买走了;套套销量暴涨50%...