`
techno_it
  • 浏览: 54524 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

Ext 验证

阅读更多

关于Ext的验证其实很简单,不知道大家是否看过Ext的例子,它提供的adv-vtypes这个例子是一个很好的Ext验证入门工具。通过这个例子我们可以知道Ext验证所用的机制是调用我们自己定义的函数进行验证的,而它自带的验证方法太少。于是我结合validation.js做了一个Ext的validation希望对大家有所帮助。

 

Ext.apply(Ext.form.VTypes, 
{
  password: function(val, field) 
  {
	    if (field.initialPassField) 
	    {
	      	var pwd = Ext.getCmp(field.initialPassField);
	      	return (val == pwd.getValue());	
	    }
    	return true;
  },
  passwordText: '两次输入的密码不一致!',
  
  chinese:function(val,field)
  {
  		var reg = /^[\u4e00-\u9fa5]+$/i;
  		if(!reg.test(val))
  		{
  			return false;
  		}
  		return true;
  },
  chineseText:'请输入中文',
  
  age:function(val,field)
  {
	  	try
	  	{
	  		if(parseInt(val) >= 18 && parseInt(val) <= 100)
	  			return true;
	  		return false;
	  	}
	  	catch(err) 
	  	{
	  		return false;
	  	}
  },
  ageText:'年龄输入有误',
  
  alphanum:function(val,field)
  {
  		try
  		{
  			if(!/\W/.test(val))
  				return true;
  			return false;
  		}
  		catch(e)
  		{
  			return false;
  		}
  },
  alphanumText:'请输入英文字母或是数字,其它字符是不允许的.',
  
  url:function(val,field)
  {
  		try
  		{
  			if(/^(http|https|ftp):\/\/(([A-Z0-9][A-Z0-9_-]*)(\.[A-Z0-9][A-Z0-9_-]*)+)(:(\d+))?\/?/i.test(val))
  				return true;
  			return false;
  		}
  		catch(e)
  		{
  			return false;
  		}
  },
  urlText:'请输入有效的URL地址.',
  
  max:function(val,field)
  {
  		try
  		{
  			if(parseFloat(val) <= parseFloat(field.max))
  				return true;
  			return false;
  		}
  		catch(e)
  		{
  			return false;
  		}
  },
  maxText:'超过最大值',
  
  min:function(val,field)
  {
  		try
  		{
  			if(parseFloat(val) >= parseFloat(field.min))
  				return true;
  			return false;
  		}
  		catch(e)
  		{
  			return false;
  		}
  },
  minText:'小于最小值',
  	  
  datecn:function(val,field)
  {
  		try
  		{
  			var regex = /^(\d{4})-(\d{2})-(\d{2})$/;
			if(!regex.test(val)) return false;
			var d = new Date(val.replace(regex, '$1/$2/$3'));
			return (parseInt(RegExp.$2, 10) == (1+d.getMonth())) && (parseInt(RegExp.$3, 10) == d.getDate())&&(parseInt(RegExp.$1, 10) == d.getFullYear());
  		}
  		catch(e)
  		{
  			return false;
  		}
  },
  datecnText:'请使用这样的日期格式: yyyy-mm-dd. 例如:2008-06-20.',
  
  integer:function(val,field)
  {
  		try
  		{
  			if(/^[-+]?[\d]+$/.test(val))
  				return true;
  			return false;
  		}
  		catch(e)
  		{
  			return false;
  		}
  },
  integerText:'请输入正确的整数',
  
  minlength:function(val,field)
  {
  		try
  		{
  			if(val.length >= parseInt(field.minlen))
  				return true;
  			return false
  		}
  		catch(e)
  		{
  			return false;
  		}
  },
  minlengthText:'长度过小',
  
  maxlength:function(val,field)
  {
  	 try
  	 {
  	 	if(val.length <= parseInt(field.maxlen))
  	 		return true;
  	 	return false;
  	 }
  	 catch(e)
  	 {
  	 	return false;
  	 }
  },
  maxlengthText:'长度过大',
  
  ip:function(val,field)
  {
  		try
  		{
  			if((/^(?:(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.){3}(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)$/.test(val)))
  				return true;
  			return false;
  		}
  		catch(e)
  		{
  			return false;
  		}
  },
  ipText:'请输入正确的IP地址',
  
  phone:function(val,field)
  {
  		try
  		{
  			if(/^((0[1-9]{3})?(0[12][0-9])?[-])?\d{6,8}$/.test(val))
  				return true;
  			return false;
  		}
  		catch(e)
  		{
  			return false;
  		}
  },
  phoneText:'请输入正确的电话号码,如:0920-29392929',
  
  mobilephone:function(val,field)
  {
  		try
  		{
  			if(/(^0?[1][35][0-9]{9}$)/.test(val))
  				return true;
  			return false;
  		}
  		catch(e)
  		{
  			return false;
  		}
  },
  mobilephoneText:'请输入正确的手机号码',
  
  alpha:function(val,field)
  {
  		try
  		{
  			if( /^[a-zA-Z]+$/.test(val))
  				return true;
  			return false;
  		}
  		catch(e)
  		{
  			return false;
  		}
  },
  alphaText:'请输入英文字母'
});

 注:如果想在页面上显示中文,请使用UTF-8编码。

这段代码我初步试了一下,并没有都试,大家可以试试,看看好用不。如果有什么错误,也请大家提出自己的想法,或者贴一下改进代码。

分享到:
评论
2 楼 techno_it 2008-06-20  
tubinee 写道
支持!!!

一个提议:
考虑做个可以从server端验证的vtype、
你是说Ajax方式的验证?
1 楼 tubinee 2008-06-20  
支持!!!

一个提议:
考虑做个可以从server端验证的vtype、

相关推荐

    绿色版_仿ext验证+仿jquery.rar

    各位csdn的朋友大家好!我的小作品诞生了!这是我历时几千几万秒做出来的一个小插件.仰望大家对小弟的不支持+支持.希望这个小东东可以给大家带来方便. 还希望大家小试一下! 看看我还有什么地方可以完善的.

    EXT 表单验证EXT 表单验证

    EXT表单验证是EXT JS框架中的一个重要特性,用于在用户输入数据时确保数据的正确性和完整性。EXT JS是一个强大的JavaScript库,专为构建富客户端Web应用程序而设计。它提供了丰富的组件库,包括表格、表单、菜单等,...

    EXT表单验证之TextField

    EXT是Sencha公司开发的一款基于JavaScript的富客户端应用框架,它提供了一套完整的组件化UI构建工具,其中EXT表单(FormPanel)是用于创建复杂数据输入和验证的重要部分。在EXT表单中,TextField是最常见的输入控件...

    Ext做密码验证

    这篇博客"Ext做密码验证"可能详细介绍了如何在ExtJS框架下实现这一功能。ExtJS是一个流行的JavaScript库,用于构建富客户端的Web应用。它提供了一个强大的组件模型和数据绑定机制,使得创建复杂的UI变得简单。 首先...

    ext3.jar ext使用非常多

    通过EXT的表单组件,可以构建复杂的表单输入和验证机制;通过EXT的图表组件,可以直观地展示数据分析结果。EXT的组件化开发模式使得代码结构清晰,维护性更强。 总的来说,EXT框架,特别是EXT3.jar,为开发者提供了...

    EXT学习心得,ext

    EXT提供了强大的表单验证功能,其中`exPro`属性允许定义复杂的验证规则。例如,`gatewayServerIp`输入框的验证规则包括不允许空白和必须符合IPv4地址格式。此外,通过`regexText`属性可以自定义错误消息,使其更加...

    Ext Vtype 表单验证实现登陆

    本篇文章将详细讲解如何利用Ext JS的Vtype(验证类型)来实现登录表单的验证功能。Ext JS是一个强大的JavaScript框架,提供了丰富的组件和功能,包括复杂的表单验证机制。 首先,理解Vtype的概念。Vtype是Ext JS中...

    ext4_utils

    最后,dumpe2fs和debugfs可用于检查和验证文件系统设置,确保所有数据都正确无误地写入。 四、安全与最佳实践 使用ext4_utils时,遵循最佳实践至关重要。这包括定期检查和修复文件系统(特别是在刷机前),谨慎...

    EXT安装包4.2.1-1

    9. **强大的表单组件**:EXT提供了各种表单元素,支持验证、动态加载和远程提交,便于构建功能完备的在线表单。 10. **性能优化**:EXT通过延迟加载、按需渲染和组件缓存等策略,提升了大型应用的性能和加载速度。 ...

    Ext 入门 登陆验证表单提交

    本文将围绕“EXT入门:登陆验证表单提交”这一主题,深入探讨EXTJS中实现登录表单验证的基本步骤和原理。 EXTJS允许我们通过其丰富的组件库创建美观且功能丰富的表单,包括输入框、按钮等元素。在登录场景中,我们...

    Ext-2.1 Ext 2全文档

    它们提供了创建和管理HTML表单的能力,支持各种输入类型、验证规则以及数据提交。Ext Form还包含了自定义表单字段、联动控制等高级特性。 对于数据管理,Ext 2.1提供了Store对象,它可以存储和管理数据,与服务器...

    EXT3.0 登录实例

    6. **响应处理**:服务器端验证成功后,会返回一个响应,EXT3.0会处理这个响应,可能包括显示登录成功消息、重定向到其他页面或者在验证失败时显示错误信息。 7. **源码分析**:EXT3.0的源码提供了学习EXT组件用法...

    纯手工打造类似Ext的验证效果

    "纯手工打造类似Ext的验证效果"这个主题聚焦于使用JavaScript进行表单验证,模仿流行的ExtJS库提供的验证功能。ExtJS是一款功能强大的JavaScript框架,它提供了丰富的组件和强大的数据绑定机制,包括复杂的表单验证...

    EXT2.0,EXT4.0,JS

    JavaScript主要用于客户端浏览器,执行动态网页效果、用户交互、数据验证等功能。它是一种解释型、基于原型的对象导向语言,具有弱类型和动态类型特性。JavaScript在Web开发中的地位举足轻重,是实现网页动态性和...

    ext 日期时间控件

    3. **验证**:EXT支持表单验证,DateTimeField可以设置`allowBlank`来控制是否允许为空,`invalidText`则可以自定义验证失败时的提示信息。 4. **国际化**:EXT框架支持多语言,日期和时间的显示可以根据不同的语言...

    ext2.0项目源代码供大家学习ext使用

    7. **FormPanel**:用于创建表单,支持各种表单元素,并能进行验证和数据提交。 8. **Drag and Drop**:EXT支持拖放操作,允许用户通过鼠标拖动组件或数据。 9. **Ext Designer支持**:EXT 2.0可能还支持EXT ...

    Ext框架开发文档及ext-core.js

    5. **表单(Forms)**:EXT提供了丰富的表单组件和表单处理功能,如文本框、下拉框、复选框等,以及表单验证和提交机制。 6. **工具栏(Toolbars)**:EXT的工具栏组件可以轻松添加各种按钮、菜单和分割线,为用户...

    Ext_2.2_API(chinese).rar_Ext 2.2 API_ext js 2_ext-2.2 api_ext2.2

    此外,`Ext.form.FormPanel`和相关组件允许创建复杂的表单,支持验证和数据提交。拖放功能允许用户通过简单的拖动操作来交互,增强了用户体验。还有许多其他工具类,如`Ext.util.Format`,提供了一系列实用的格式化...

    ext UI效果模板

    1. 表单元素:如文本框、复选框、单选按钮、下拉列表等,支持各种验证和动态加载。 2. 数据网格:用于展示大量数据,支持分页、排序、过滤和编辑。 3. 工具栏和菜单:提供常用操作的快捷入口,可以自定义图标和事件...

Global site tag (gtag.js) - Google Analytics