ExtJs添加树形结构数据校验表单

最新推荐文章于 2022-03-23 11:22:23 发布

阿源0922

最新推荐文章于 2022-03-23 11:22:23 发布

阅读量232

点赞数

分类专栏： ExtJs 文章标签： ExtJs编码校验框树控件添加子节点动态校验是否唯一

本文链接：https://blog.csdn.net/yaoliyuan0922/article/details/100146225

版权

ExtJs 专栏收录该内容

7 篇文章 3 订阅

订阅专栏

效果图：

在这里插入图片描述

说明：

上图中的编码表单分两部分，左边为规定好的上级树节点Code（不能修改），右边为动态查重表单，可实时校验您输入的编码是否已存在于数据库中***（代码附在文末）***
前台代码图：

在这里插入图片描述

后台代码图：

代码：

这里代码只贴前端，下面的代码直接放到item中就可以使用，效果图如下：

{
			xtype : "fieldcontainer",
			fieldLabel : "编码",
			layout : "hbox",
			items : [ 
				{
					width : 120,
					xtype : "textfield",
					id : "oldSysCode",
					name : "oldSysCode",   
					readOnly : true,
					allowBlank : false,
				},{
					width : 130,
					xtype : "textfield",
					id:"newMenuCode",
					name : "newMenuCode",
					emptyText: '--填写三位编码--',
					allowBlank : false,
					minLength : 3,
					maxLength : 3,
					validator : function() {
						var error = true;
						var oldSysCode =Ext.getCmp("oldSysCode").getValue();
                        var newMenuCode =Ext.getCmp("newMenuCode").getValue();
						Ext.Ajax.request({
							url : getServerHttp() +"/nh-bank/cp/sysAndMenus/baseMenusAndButtonCodeExists?oldSysCode="+oldSysCode+"&newMenuCode="+newMenuCode,
									method:"POST",
									scope : this,
									async : false,
									success : function(response) {
										var result = Ext.JSON.decode(response.responseText);
										if ("yes" == result.result) {
											error = "该系统代号己经存在,请重新输入！";
										}
									}
								});
						return error;
					}
				} 
			]
		},