手机
当前位置:查字典教程网 >编程开发 >AJAX相关 >SSH+Jquery+Ajax框架整合
SSH+Jquery+Ajax框架整合
摘要:近期学习了SSH2(Struts2+Spring+Hibernate)的整合后,开始尝试的写一个登陆界面,结果发现:若是单单使用struts...

近期学习了SSH2(Struts2+Spring+Hibernate)的整合后,开始尝试的写一个登陆界面,结果发现:若是单单使用struts2来进行页面跳转的话页面的效果不怎么样,同时也无法进行局部刷新(即异步提交验证)。

于是,我开始在网上搜索解决的办法,有些说通过一个隐藏的iframe来达到效果,当我总觉得麻烦和不实用。后来问了下老师,告诉了我使用ajax可以达到想要的效果,我又发现网上有很多例子都是ajax的,但缺少的就是SSH2(整合好的)和ajax 的整合(ajax使用了jQuery框架)。

说说我想要的效果:

登录页面点击提交后 进行后台的验证;

验证成功跳转到index.Jsp;

验证失败则在本登录页面执行一个jQuery脚本提示用户;

需要的包:

SSH2使用到的包外,还需要struts2的以下包:

commons-beanutils-1.8.0.jar

commons-collections-3.1.jar

commons-fileupload-1.3.1.jar

commons-io-2.2.jar

commons-lang-2.4.jar

commons-lang3-3.1.jar

commons-logging-1.1.3.jar

ezmorph-1.0.6.jar

freemarker-2.3.19.jar

json-lib-2.3-jdk15.jar

ognl-3.0.6.jar

struts2-core-2.3.16.3.jar

struts2-json-plugin-2.3.16.3.jar

xwork-core-2.3.16.3.jar

好了,开始贴代码:

login.jsp

<html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type"content="text/html; charset=utf-8" /> <title>会员登陆</title> <> <script type="text/javascript"src="js/jquery.js"></script> <script type="text/javascript"> $(document).ready(function(){ $("#button").click (function(){ varuser =$("#User").val(); varpassWord =$("#PassWord").val(); $.ajax({ //这里的需要Struts.xml的<action/>的name属性一致。 url:‘login.action‘, //提交类型 type:‘POST‘, //提交数据给Action传入数据 data:{‘User‘:user,‘PassWord‘:passWord}, //返回的数据类型 dataType:‘json‘, //成功是调用的方法 success:function(data){ //获取Action返回的数据用 data.Action中的属性名 获取 if(data.result=="false") { alert("账号密码错误"); }elseif(data.result=="true"){ //进行页面跳转,因为ajax我们的Action只返回数据,不在进行跳转了... location.href = "index.jsp"; } } }); }); }); </script> </head> <body>

账号:<input id="User" name="User"type="text" /><br/>

密码:<input id="PassWord" name="PassWord"type="password" /><br/>

<input id="button" type="button"value="提交" /> </body> </html>

LoginAction.java

publicclass LoginAction extends ActionSupport { //使用@Resource注解注入条件属性名与 ref要一致才可 @Resource FUserService fUserServiceImp; @Resource FUser fUser; private String User; private String PassWord; private String result; public String getResult() { returnresult; } publicvoid setUser (String User) { this.User = User; } publicvoid setPassWord(String PassWord) { this.PassWord = PassWord; } public String execute() throws Exception { HttpServletRequest request = ServletActionContext.getRequest(); //获取ajax传过来的数据直接使用前台的属性名即可获取。 fUser.setUserEmail(User); fUser.setUserPassWord(PassWord); if(fUserServiceImp.CheckUser(fUser)!=null){ //返回给ajax的数据 this.result = "true"; }else{ this.result = "false"; } return"success"; } }

Struts.xml

<"1.0"encoding="UTF-8"?> <struts> <!—这是我们配置SSH时配置Struts的package --> <package name="Struts" extends="struts-default"> <action name="login"class="loginAction"> </action> </package> <!—为了让ajax可以调用Spring中的Action 配置ajax的package --> <package name="ajax_json" extends="json-default"> <!—本处的id就是ajax url的值,class引用了Spring 配置Action的id--> <action name="login"> <result name="success" type="json"/> </action> </package> </struts>

其他SSH2框架整合的不需要改动这样就可以将jQuery框架的ajax整合入SSH2框架使用了!

以上内容是个人所想,如有不对的地方欢迎给我留言,我会在第一时间和大家取得联系,谢谢大家一直以来对查字典教程网的支持。

【SSH+Jquery+Ajax框架整合】相关文章:

JSP+Ajax 添加、删除多选框

Jquery Ajax请求文件下载操作失败的原因分析及解决办法

herf=#导致Ajax请求时没有向后台发送数据

Ajax 框架学习笔记

Ajax发送和接收请求

jQuery Ajax方式上传文件的方法

JQuery+Ajax+Struts2+Hibernate框架整合实现完整的登录注册

jQuery+Ajax实现表格数据不同列标题排序(为表格注入活力)

基于Jquery ajax技术实现间隔N秒向某页面传值

JQuery ajax返回JSON时的处理方式 (三种方式)

精品推荐
分类导航