SpringMVC(26):简单的json数据校验示例(实现功能:使用jQuery框架的ajax()方法来实现 userCode的校验)

2018年2月11日

【0】功能:利用ajax能够异步与后台进行小数据的互传,点击按钮,建议进行对userCode的输入内容进行校验。前端:JavaScript、ajax和json;

实现:springmvc如何处理json对象?首先要使用json,需要引入处理json数据的工具jar文件,这里使用阿里巴巴的fastjson-1.2.45.jar。


【1】View层-页面显示:

      用户编码-ajax :<input type="text" id="userCode" name="userCode" value=""/><input type="button" οnclick="org()">Ajax验证</input><br>


【2】View层-Ajax处理:

<script type="text/javascript" src="${pageContext.request.contextPath}/statics/js/jquery-3.3.1.js"></script>
<script type="text/javascript">
function org(){
	$.ajax({
		type:"GET",
		url:"ucexist.html",
		data:{userCode:$("#userCode").val()},
		dataType:"json",
		success:function(data){
			alert("data: "+data);
			if(data.userCode == "exist"){
				alert("userCode "+data.userCode+" !");
			}else{
				alert("userCode accessible!");
			}
		}
	})
}
</script>

解释:在上述代码中,当用户完成用户编码输入之后,点击按钮会进行Ajax异步验证,请求URL为“/user/ucexist.html”,请求参数为用户输入的userCode的值。异步调用请求后,返回的数据类型为JSON类型,若成功,则根据返回的json对象进行信息提示。


【3】Controller层:

在userController添加处理方法:

	@RequestMapping(value="/ucexist.html")
	@ResponseBody
	public Object userCodeIsExit(@RequestParam String userCode) throws SQLException, ParseException{
		System.out.println("UserController-userCodeIsExit");
		System.out.println("**Ajax提交的数据:userCode "+userCode);
		HashMap<String,String> resultMap = new HashMap<String,String>();
		if(StringUtils.isEmpty(userCode)){
			resultMap.put("userCode", "exist");
		}else{
			User user = userService.selectUserCodeExist(userCode);
			if(user.getAddress() != null){
				resultMap.put("userCode", "exist");
			}else{
				resultMap.put("userCode", "noexist");
			}
		}
		System.out.println("**resultMap-key&value: "+resultMap);
		return JSONArray.toJSONString(resultMap);
	}

解释:(1)控制器的处理方法userCodeIsExit() ,通过前台传递过来的userCode进行入参,最后返回Object。在方法体内,调用userService的selectUserCodeExist()进行验证,并返回user对象。若user为空,则证明不重名,反之重名。

(2)对于验证结果,则放进去HashMap里,通过JSONArray.toJSONString(resultMap),把其转换为json对象,进行返回输出。

(3)注意:需要使用@ResponseBody 注解,该注解作用:将标注该注解的处理方法的返回结果直接写入HTTP Response Body(Response 对象的数据区中)。一般情况下,@ResponseBody会在异步获取数据时使用,被其标注的方法返回的数据将会输出到响应流中,客户端获取并显示。


【4】测试结果

打印日志:

1 session.getAttribute(user)+++nullUser [id=null, userCode=null, userName=null, userPassword=null, gender=null, birthdayString=null, birthday=null, phone=null, address=null, userRole=null, createdBy=null, creationDate=null, creationDateString=null, modifyBy=null, modifyDate=null, modifyDateString=null, idPicPath=null, workPicPath=null, roleName=null]
UserController-userCodeIsExit
**Ajax提交的数据:userCode ffff
UserServiceImpl-selectUserCodeExist
UserDaoImpl-selectUserCodeExist
select - sql1: select * from smbms_user where userCode='ffff';

**resultMap-key&value: {userCode=exist}

测试输入与结果:





myeclipse 10.5 破解文件 1. 输入Usercode, 点击'SystemId...', 生成SystemId 2. 点击'Active', 生成LICENSE_KEY, ACTIVATION_CODE, ACTIVATION_KEY 3. 点击菜单'Tools -> 2.SaveProperties...', 目的是把生成的LICENSE_KEY, ACTIVATION_CODE, ACTIVATION_KEY保存到C:\Documents and Settings\Administrator\.myeclipse.properties文件中 4. 点击菜单'Tools -> 1.ReplaceJarFile', 选择${eclipse_home}/plugins目录, 等待30秒左右. 目的是: Replacing [SignatureVerifier <before MyEclipse 10.5>]. Done. Replacing [publicKey.bytes]. replacing file [${eclipse_home}\plugins\com.genuitec.eclipse.core_10.5.0.me201206170059.jar] and create bakFile [${eclipse_home}\plugins\com.genuitec.eclipse.core_10.5.0.me201206170059.jar.bak20120623123135] update [com/genuitec/eclipse/core/publicKey.bytes] Done. Replacing [SpecialSignatureVerifier<for MyEclipse.10.5>]. replacing file [${eclipse_home}\plugins\com.genuitec.eclipse.core.common_10.5.0.me201206160414.jar] and create bakFile [${eclipse_home}\plugins\com.genuitec.eclipse.core.common_10.5.0.me201206160414.jar.bak20120623123142] update [com/genuitec/eclipse/core/ui/preference/MECPListContentProvider.class] replacing file [${eclipse_home}\plugins\com.genuitec.eclipse.easie.core_9.0.0.me201203160414\easiecore.jar] and create bakFile [${eclipse_home}\plugins\com.genuitec.eclipse.easie.core_9.0.0.me201203160414\easiecore.jar.bak20120623123143] update [com/genuitec/eclipse/easie/core/ui/action/ServerValidateAction.class] replacing file [${eclipse_home}\plugins\com.genuitec.eclipse.j2eedt.core_10.0.0.me201203160414\j2eedtcore.jar] and create bakFile [${eclipse_home}\plugins\com.genuitec.eclipse.j2eedt.core_10.0.0.me201203160414\j2eedtcore.jar.bak20120623123146] update [com/genuitec/eclipse/j2eedt/taglib/TagLibReader.class] replacing file [${eclipse_home}\plugins\com.genuitec.myeclipse.product_10.5.0.me201206160414\myeclipse-product.jar] and create bakFile [${eclipse_home}\plugins\com.genuitec.myeclipse.product_10.5.0.me201206160414\myeclipse-product.jar.bak20120623123147] update [com/genuitec/myeclipse/product/ProductViewer.class] 执行以上4个步骤,破解成功.
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值