ExtJS4.2 文本框中多个验证的提示信息显示问题

最新推荐文章于 2021-04-28 12:16:43 发布

AlinPan

最新推荐文章于 2021-04-28 12:16:43 发布

阅读量1.4k

点赞数

分类专栏： extjs+mvc

本文链接：https://blog.youkuaiyun.com/u011570965/article/details/38662331

版权

extjs+mvc 专栏收录该内容

5 篇文章

订阅专栏

在ExtJS4.2中，针对文本框进行多个验证时，通常会遇到验证提示信息整合的问题。本文探讨了如何自定义validator实现有效的验证提示，确保在输入不符合要求时提供清晰的错误反馈。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

当文本框需要多个验证的时候，我们经常是自定义验证validator，如下：

{
							id : 'roleNameId',
							fieldLabel : '角色名称',
							allowBlank : false,
							afterLabelTextTpl : PlatMap.redFlag,  
							<span style="color:#3333FF;">blankText : '角色名称不能为空',
							emptyText : '请输入角色名称',
							regex : /\S/,
							regexText : '角色名称不能为空',
							maxLength : 50,
							maxLengthText : '最多可输入50字符',</span>
							name : 'roleName',
							validationEvent : 'blur',
							validator : function(thisText) {//自定义验证事件
								var isRoleNameOK = true;// 先定义个全局变量
								var Mform = this.ownerCt.ownerCt;
								var roleNameValue = Mform.down('textfield[name=roleName]').getValue();
								var role_Id = Mform.down('hiddenfield[name=roleId]').getValue();
								
                                                               <span style="color:#3333FF;"> //当有其他多个验证时，这里必须是满足其他验证条件下的验证，因此要排除其他的情况，如果没有排除其他的验证，
                                                                那么当不符合其他验证条件时，所显示的提示信息有问题（文本框变红但是没有提示信息或者提示信息不完整）</span>
								<span style="color:#FF0000;">var length = roleNameValue.trim().length;
								if(length!=0 && length<=50)</span>{//当输入内容时验证																				
										if(roleNameValue.trim()!=null){//当输入满足以上基本要求的内容时，验证唯一性																			
												Ext.Ajax.request({
													url : '/base/role/validateRoleName',
													method : 'POST',
													params : {
														roleId : role_Id,
														roleName : roleNameValue
													},
													success : function(response) {
														var result = Ext.decode(response.responseText);
														if (!result.success) {
															isRoleNameOK = false;
															Ext.getCmp('roleNameId').markInvalid("角色名称已存在，请重新输入！");
														} else {
															isRoleNameOK = true;
															Ext.getCmp('roleNameId').clearInvalid();
														}
													}
												});
										
											return isRoleNameOK;
										}
									}
								}
							}