SSH系列:(12)用户管理-表单校验

在用户的新增(add)、编辑(edit)中对用户名(username)、密码(password)进行非空校验帐号(account)的唯一性校验

需要注意的是在编辑页面(editUI.jsp)帐号(account)的唯一性校验要排除当前编辑的帐号,不然将出现无法保存的情况。

1、JSP页面

在jsp页面中,分别进行两个时机的校验,①是在编辑帐号(account)的表单域时需要到服务器中校验是否已经存在输入的帐号;②在提交(submit)表单时再次进行校验,避免在填写表单时帐号已被使用的情况;

表单部分

<form id="form" name="form" action="${basePath}/tax/user_add.action" method="post" enctype="multipart/form-data">
    <s:textfield id="name" name="user.name"/>
    <s:textfield id="account" name="user.account" onchange="doVerify()"/>
    <s:textfield id="password" name="user.password"/>
    <input type="button" class="btnB2" value="保存" onclick="doSubmit()"/>
    <input type="button"  onclick="javascript:history.go(-1)" class="btnB2" value="返回" />
</form>

addUI.jsp中Javascript部分

    <script type="text/javascript">
    	var vResult = false;
    	//检验帐号唯一性
    	function doVerify(){
    		//1、获取帐号
    		var account = $(‘#account‘).val();
    		if(account != null){
    			//2、校验
    			$.ajax({
    				url:"${basePath}/tax/user_verifyAccount.action",
    				data:{"user.account":account},
    				type:"post",
    				async:false,//非异步
    				success:function(msg){
    					if("true" != msg){
    						//帐号已经存在
    						alert("帐号已经存在。请使用其它账号");
    						//定焦
    						$(‘#account‘).focus();
    						vResult = false;
    					}
    					else{
    						vResult = true;
    					}
    				}
    			});
    		}    
    	}
    
    	//提交表单
    	function doSubmit(){
    		var $name = $(‘#name‘);
    		if($name.val() == ""){
    			alert("用户名不能为空!");
    			$name.focus();
    			return false;
    		}
    
    		var $password = $(‘#password‘);
    		if($password.val() == ""){
    			alert("密码不能为!");
    			$password.focus();
    			return false;
    		}
    
    		//帐号校验
    		doVerify();
    		if(vResult){
    			//提交表单
    			document.forms[0].submit();
    		}
    	}
    </script>

editUI.jsp内的Javascript部分有一点不同,就是:在进行帐号(account)验证的时候,需要同时传递id过去。

    	var vResult = false;
    	//检验帐号唯一性
    	function doVerify(){
    		//1、获取帐号
    		var account = $(‘#account‘).val();
    		if(account != null){
    			//2、校验
    			$.ajax({
    				url:"${basePath}/tax/user_verifyAccount.action",
    				data:{"user.account":account,"user.id":"${user.id}"},//注意:这里是用EL表达式取ValueStack上的值
    				type:"post",
    				async:false,//非异步
    				success:function(msg){
    					if("true" != msg){
    						//帐号已经存在
    						alert("帐号已经存在。请使用其它账号");
    						//定焦
    						$(‘#account‘).focus();
    						vResult = false;
    					}
    					else{
    						vResult = true;
    					}
    				}
    			});
    		}    
    	}

知识点(1)EL表达式获取ValueStack上的值


Struts2中EL表达式取值

http://blog.csdn.net/cuihaiyang/article/details/41950141

struts2 request内幕 为什么在struts2用EL表达式可以取值

http://www.tuicool.com/articles/bQzaEzI

Struts2中的ModelDriven机制及其运用

http://blog.csdn.net/li_tengfei/article/details/6098145

2、后台(服务器端)

2.1、action层

UserAction.java

	public void verifyAccount(){

		try {
			//1、获取账号
			if(user != null && StringUtils.isNotBlank(user.getAccount())){
				//2、根据帐号到数据库校验是否存在该帐号对应的用户
				List<User> list = userService.findUserByAccountAndId(user.getId(),user.getAccount());
				String strResult = "true";
				if(list != null && list.size()>0){
					//说明该帐号已经存在
					strResult = "false";
				}

				//输出
				HttpServletResponse response = ServletActionContext.getResponse();
				response.setContentType("text/plain");
				ServletOutputStream outputStream = response.getOutputStream();
				outputStream.write(strResult.getBytes());
				outputStream.close();
			}
		} catch (IOException e) {
			e.printStackTrace();
		}
	}

知识点(1)StringUtils


org.apache.commons.lang3.StringUtils

位于struts-2.3.29\commons-lang3-3.2.jar中

    public static boolean isEmpty(CharSequence cs)
    {
        return cs == null || cs.length() == 0;
    }

    public static boolean isNotEmpty(CharSequence cs)
    {
        return !isEmpty(cs);
    }

    public static boolean isBlank(CharSequence cs)
    {
        int strLen;
        if(cs == null || (strLen = cs.length()) == 0)
            return true;
        for(int i = 0; i < strLen; i++)
            if(!Character.isWhitespace(cs.charAt(i)))
                return false;

        return true;
    }

    public static boolean isNotBlank(CharSequence cs)
    {
        return !isBlank(cs);
    }

2.2、service层

UserService.java

List<User> findUserByAccountAndId(String id, String account);

UserServiceImpl.java

	public List<User> findUserByAccountAndId(String id, String account) {
		return userDao.findUserByAccountAndId(id,account);
	}

2.3、dao层

UserDao.java

List<User> findUserByAccountAndId(String id, String account);

UserDaoImpl.java

	public List<User> findUserByAccountAndId(String id, String account) {
		String hql = "from User where account=?";
		if(StringUtils.isNotBlank(id)){
			hql += " and id !=?";
		}
		Query query = getSession().createQuery(hql);
		query.setParameter(0, account);
		if(StringUtils.isNotBlank(id)){
			query.setParameter(1, id);
		}
		return query.list();
	}
时间: 2024-10-09 08:15:33

SSH系列:(12)用户管理-表单校验的相关文章

2.12 学习总结 之 表单校验插件validate

一.说在前面 昨天 学习了ajax的相关知识 今天 学习表单校验插件validate, 并使用ajax 自定义校验规则 二.validate 插件 1.网络上有许多成熟的插件共使用者参考,插件就是将jquery实现的常用操作进行封装,封装后的小框架就可以叫做插件,按照插件的语法去操作可以实现很多复杂的功能,而这些复杂功能的背后实现我们可以不必懂. 2.导入插件的步骤: 1) 将jquery的原始文件和插件文件jquery.validate.js导入到工程中 2) 编写js代码对表单进行验证 3.

示例-表单校验-多内容

1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 2 <html xmlns="http://www.w3.org/1999/xhtml"> 3 <head> 4 <meta http-equiv="

【转载】springMVC表单校验+全注解

在这篇文章中,我们将学习如何使用Spring表单标签, 表单验证使用 JSR303 的验证注解,hibernate-validators,提供了使用MessageSource和访问静态资源(如CSS,JavaScript,图片)国际化支持我们的视图,使用ResourceHandlerRegistry,全部采用基于注解的配置. 我们将创建一个包含一个学生注册表格的简单应用,用户输入表单提交验证通过 JSR303 的验证注释验证,通过覆盖属性文件可使用国际验证消息的默认消息,还访问静态资源(如应用引

JQuery 表单校验插件 validate 实践纪录

JS诞生其中一个目的就是将, 服务器端的校验在客户端提前完成, 以避免用户提交数据后, 后台校验报错的糟糕用户体验. 基于JQuery库的有很多优秀的插件, 其中对于浏览器端表单进行验证的基本功能也有插件对应, validate插件便是一个. 官网地址 : http://jqueryvalidation.org/ 官网文档:http://jqueryvalidation.org/documentation/ 下面网址是开发者提供的demo, 代码可下载, 可以给大家提供参考: http://jq

vue+element表单校验功能

要实现这个功能其实并不难,element组件直接用就可以, 但是我在使用过程中碰到了几个坑,就记录下来,分享给大家,避免落坑,话不多说,直接上过程...... 表单校验功能:   实现这个功能,总共分为以下4布: 在el-form标签中定义:rules="rules";ref="reference" 在el-form-item定义prop="name"; 在选项data中定义rules校验规则; 在提交方法中检查用户行为 template代码:

【JAVAWEB学习笔记】28_jqueryAjax:json数据结构、jquery的ajax操作和表单校验插件

Ajax-jqueryAjax 今天内容: 1.json数据结构(重点) 2.jquery的ajax操作(重点) 3.jquery的插件使用   一.json数据结构 1.什么是json JSON(JavaScript Object Notation) 是一种轻量级的数据交换格式.它基于ECMAScript的一个子集. JSON采用完全独立于语言的文本格式,但是也使用了类似于C语言家族的习惯.这些特性使JSON成 为理想的数据交换语言.易于人阅读和编写,同时也易于机器解析和生成(一般用于提升网络

利用jquery.validate以及bootstrap的tooltip开发气泡式的表单校验组件

表单校验是页面开发中非常常见的一类需求,相信每个前端开发人员都有这方面的经验.网上有很多成熟的表单校验框架,虽然按照它们默认的设计,用起来没有多大的问题,但是在实际工作中,表单校验有可能有比较复杂的个性化的需求,使得我们用这些插件的默认机制并不能完成这些功能,所以要根据自己的需要去改造它们(毕竟自己还不到那个写一个完美的校验框架的层次).我用过formValidation这个校验框架,虽然它跟bootstrap配合地很好,但是校验风格太死板,不太满足个性化的场景:后来我找到了jquery.val

创建通用的表单校验逻辑库

表单校验一直是web开发中最基础,也是最不好做的一个环节.说是基础,相信多少从事web开发的人第一件事就是学习如果基于js.jQuery实现表单验证工作.在10年前,甚至是5年前,JavaScript还是被多数工程师轻视的一门语言,那时候很多人认为JavaScript充其量也就能完成一部分表单校验的工作.由此可知表单校验是多么基础的一件事情:说它不好做,是因为表单校验往往工作量极大,可以说是一个没太大技术含量但是很耗费体力的活,而且在一些对交互友好性要求较高的项目中,表单校验就更加费事了. 于是

我教女朋友学编程Html系列(6)—Html常用表单控件

做过网页的人都知道,html表单控件十分重要.基本上我们注册会员.登录用户,都需要填写用户名.密码,那些框框都是表单控件. 本来今天就想写一些常用的html表单控件,于是开始搜资料,找到了一个网页,作者的写作思路和我的基本相同,不过不足的是缺少效果图. 我打算结合着这位仁兄的文章补充一下,增加一些效果图,另外把一些新内容也补充进去,原文的地址是: HTML表单(Forms) 我站在这位仁兄的肩膀上写作,再增加一些东西,配上一些图,我想,效果应该很好,接着就跟着我来学习吧. HTML表单(Form