`

Ext扩展TriggerField实现唯一值校验

阅读更多

为了验证输入域的值为唯一值,扩展了Ext.form.TirggerField 实现Ajax方式的自定义验证输入域。原使用Ext.Ajax的内置方法,但Doc中对request方法的特别注释是:

 

Important: Ajax server requests are asynchronous, and this call will return before the response has been received. Process any returned data in a callback function.

To execute a callback function in the correct scope, use the scope option.

 

如上所说,Ajax服务请求是异步的,即函数会立即返回,然后是执行callback回调方法,这样就会产生时序问题,TriggerField的validator方法会首先接收到函数的undefined返回,这样验证就出现了错误,会误认为验证失败,但Ext.Ajax的config option中没有关于XMLHttpRequest使用异步还是同步的方式请求的设置。这样就没办法解决时序问题,所以改为使用Prototype的Ajax对象实现此功能,Prototype的Ajax中有asynchronous项属性来决定到底使用同步还是异步方式来请求,把asynchronous: false ,时序问题就迎刃而解了。

 

  Ext.ux.UniqueField = Ext.extend(Ext.form.TriggerField, {
			allowBlank: false,
			validateOnBlur: true,  
			invalidText: '此字段值需唯一!',
			validator: function() {
				uniqueFieldValidation(this);
				return valid;
			},
			onTriggerClick: function() {
				uniqueFieldValidation(this);
				return valid;
			}
		});

		var valid = '';
		function uniqueFieldValidation(element) {
			new Ajax.Request('dictionaryCodeValidation.do', {
					asynchronous: false,
					onSuccess: function(response) {
					var result = response.responseText.evalJSON();
					if(result.isUniqueCode) {
						valid = true;
						return;
					} else {
						valid = false;
						return;
					}
				},
				parameters: { dictionaryCode: $(element.getId()).value }
			});
		}
 
分享到:
评论

相关推荐

    codePress Ext 扩展代码实现

    总结来说,codePress Ext扩展的实现涉及到以下几个关键知识点: 1. EXTJS框架:理解EXTJS的组件化架构,掌握如何创建和配置EXT组件。 2. codePress编辑器:熟悉codePress的API,学习如何实现代码高亮、编辑功能和...

    ext_表单提交_数据校验

    在Ext JS框架中,`Ext.form.TextField`是一种用于收集用户输入的基本控件,它提供了丰富的配置选项来实现数据校验。例如,在示例中,通过设置`allowBlank: false`,确保了字段不允许为空;`emptyText`定义了当字段为...

    TreeComboField 扩展自Ext.form.TriggerField

    这个是扩展自Ext.form.TriggerField的代码,很好用的,分享下

    Ext扩展dateField时间控件,可以选择年月日、年月、年、月

    在本文中,我们将深入探讨`Ext`框架中的`dateField`扩展,特别是在允许用户选择不同时间范围方面的能力,如年月日、年月、年或仅月。`Ext`是Sencha公司开发的一个强大的JavaScript应用框架,常用于构建富客户端Web...

    ext 扩展子列表头

    EXTJS以其强大的组件模型和优雅的数据绑定机制而闻名,其中"EXT 扩展子列表头"是EXTJS框架中的一种功能,主要应用于数据展示和交互。本文将深入探讨这个主题,以及如何在EXTJS中实现列表头的分层结构。 "EXT 扩展...

    ext校验日期统一处理方法

    ext校验日期统一处理方法,可以使用此方式一次性处理好时间段校验问题

    Ext grid 动态添加字段、列扩展

    Ext grid 动态添加字段、列扩展, 如何动态添加或者删除一个grid的列

    Ext组件扩展包 - DateTime

    Ext组件扩展包 - DateTime 是一个专门用于增强JavaScript应用程序中日期和时间处理能力的工具集。在Web开发中,尤其在创建交互式用户界面时,日期和时间选择器是不可或缺的一部分。此扩展包提供了美观且功能丰富的...

    Openlayers扩展插件ol-ext ,2022年4月版本v3.2.23

    而ol-ext是针对OpenLayers的一个扩展插件,它增加了许多额外的功能和视觉效果,使得地图开发更为便捷和美观。 在2022年4月发布的ol-ext版本v3.2.23中,我们关注以下几个关键知识点: 1. **图形和符号**:ol-ext...

    Ext扩展控件,可以用图片显示百分之多少

    在描述中提到的支持表格中百分数的单元格以图片显示成进度条的形式,实际上是一种自定义扩展,可能基于EXT的CellEditing或RowEditing插件,通过自定义渲染器来实现。这种扩展可以显著提升用户体验,使数据可视化更加...

    ext扩展_Flash表单上传组件

    在本案例中,"Flash 表单上传组件"是 EXT 扩展中用于实现文件上传功能的一个特殊模块,它利用 Adobe Flash 技术来处理大文件上传和多文件同时上传,解决了传统 HTML 表单上传的限制。 1. **EXTJS 框架基础**:EXTJS...

    ext扩展 延时加载

    在IT行业中,"ext扩展 延时加载"是一个关于前端开发的重要概念,特别是对于使用Ext JS框架的应用程序。Ext JS是一个强大的JavaScript库,用于构建数据驱动的富客户端应用程序。延时加载(Lazy Loading)是一种优化...

    Ext3.0 实现验证码

    本项目实现了在Ext3.0环境中集成验证码功能,结合服务器端的Tomcat,为用户提供了一个安全的验证环境。 验证码的主要目的是通过要求用户输入图片中显示的一串随机字符,来验证用户是人类而非机器。在Web应用中,...

    Ext扩展控件,支持复制,粘贴,剪切

    "Ext扩展控件,支持复制,粘贴,剪切"这个主题涉及到的是ExtJS中的自定义插件开发,用于增强其内置控件的功能,特别是添加了常见的文本编辑操作,如复制(Copy)、粘贴(Paste)和剪切(Cut)。 在标准的Web浏览器...

    linux ext2 文件系统模拟 c语言实现

    Linux的EXT2(第二扩展文件系统)是早期广泛使用的文件系统之一,特别是在嵌入式系统和Linux服务器上。EXT2的C语言实现是一项技术性极强的任务,涉及到对操作系统底层机制的理解,包括文件系统的结构、inode、超级块...

    Ext下拉列表扩展lovcombo

    EXT下拉列表扩展LOVCombo(LovCombo)是一种特殊类型的下拉列表,它不仅提供传统的单选选项,还支持多选,通过复选框的形式来实现。这种组件在数据录入、筛选和配置场景中非常常见,因为它可以方便地让用户从多个...

    基于java 的Ext 简单效果实现

    简单的Ext 富客户端实现 简单的Ext 富客户端实现 简单的Ext 富客户端实现

    Ext3.0实现多文件上传.rar

    在“Ext3.0实现多文件上传.rar”这个压缩包中,我们聚焦于一个特定的功能:使用Ext3.0来实现实时的多文件上传功能。这个功能通常在网页应用中用于让用户能够一次性上传多个文件,如图片、文档等,极大地提高了用户...

    Ext扩展整理后吐血奉献

    【描述】虽然描述为空,但我们可以推断这篇博客可能详细介绍了作者在使用和开发Ext JS扩展过程中的心得体会,包括但不限于解决的问题、实现的功能以及可能遇到的陷阱。博主“laodaobazi”可能分享了一些实用技巧,...

    EXT扩展Htmleditor,在工具栏中添加插入图片按钮,可选择图片插入到编辑器中(也可添加其他功能按钮)

    EXT是一个强大的JavaScript库,主要用来构建富客户端应用。...记住,EXT Htmleditor不仅限于插入图片,你可以根据项目需求添加更多功能,如表格操作、链接插入、视频嵌入等,只需按照上述方法进行扩展即可。

Global site tag (gtag.js) - Google Analytics