DWR与SSH 配置

前端之家收集整理的这篇文章主要介绍了DWR与SSH 配置前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

项目需要用到Ajax,最开始本想用Jquery,最后权衡下选择了DWR。

这里说的是DWR整合SSH,其实DWR完全没有必要和Struts2结合,毕竟DWR需要返回的是Object,而Struts2直接转向了页面。非要强制将二者整合,只能做一个伪Action,这个伪Action返回的还是Object。当然DWR和Spring、Hibernate结合就非常好,可以将Struts2戏称为小三了 O(∩_∩)O ~

扯得有点远了,步入正题。

需求描述:

根据新闻标题(title)利用Ajax模糊查询新闻集合(这里将这些新闻集合称之为相关新闻),并将得到的相关新闻在页面以列表的形式展示出来,且需要实现分页

框架搭建(这里只讲与DWR有关的配置,DWR--Version: 2.0.1)à

web.xml:

[xhtml]@H_403_19@ view plain copy
  1. <listener>
  2. <listener-class>org.springframework.web.context.ContextLoaderListener</listener-class>
  3. </listener>
  4. <servlet>
  5. <servlet-name>dwr-invoker</servlet-name>
  6. <servlet-class>org.directwebremoting.servlet.DwrServlet</servlet-class>
  7. <init-param>
  8. <param-name>debug</param-name>
  9. <param-value>true</param-value>
  10. </init-param>
  11. </servlet>
  12. <servlet-mapping>
  13. <servlet-name>dwr-invoker</servlet-name>
  14. <url-pattern>/dwr/*</url-pattern>
  15. </servlet-mapping>

dwr配置文件

[xhtml]@H_403_19@ view plain copy
  1. <?xmlversion="1.0"encoding="UTF-8"?>
  2. <!DOCTYPEdwrPUBLIC"-//GetAheadLimited//DTDDirectWebRemoting
  3. 2.0//EN""http://www.getahead.ltd.uk/dwr/dwr20.dtd">
  4. <dwr>
  5. <allow>
  6. <createjavascript="showList"creator="spring"
  7. scope="application">
  8. <paramname="beanName"value="dwrquery"/>
  9. </create>
  10. <convertmatch="org.huajun.news.bean.News"converter="bean">
  11. </convert>
  12. <convertconverter="bean"match="java.lang.StackTraceElement"/>
  13. <convertconverter="exception"match="java.lang.Exception"/>
  14. </allow>
  15. </dwr>

dwr的spring配置文件(这里将其单独作为一个配置文件,需将其import到applicationContext.xml内,这里将伪action交于spring代管):

[xhtml]@H_403_19@ view plain copy
  1. <?xmlversion="1.0"encoding="UTF-8"?>
  2. <beansxmlns="http://www.springframework.org/schema/beans"
  3. xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
  4. default-autowire="byName"
  5. xsi:schemaLocation="http://www.springframework.org/schema/beanshttp://www.springframework.org/schema/beans/spring-beans-2.0.xsd">
  6. <beanid="dwrquery"class="org.huajun.dwr.action.DWRQuery"scope="prototype">
  7. <propertyname="qes">
  8. <refbean="qes"/>
  9. </property>
  10. </bean>
  11. <beanid="qes"class="org.huajun.dwr.serviceImpl.DWRQueryServiceImpl"scope="prototype">
  12. <propertyname="qd">
  13. <refbean="qd"/>
  14. </property>
  15. </bean>
  16. <beanid="qd"class="org.huajun.dwr.daoImpl.DWRQueryDaoImpl"></bean>
  17. </beans>

新闻Bean(只列举出页面列表迭代用到的字段):

[java]@H_403_19@ view plain copy
  1. privateStringtitle;//标题
  2. privateStringcreater;//录入人
  3. privateintchecks;//点击数

dwr package:

由于service只是简单的dao的引用,所以这里只列出核心的两个类: DWRQueryDaoImpl 和DWRQuery (DWRQuery--这个伪Action的小三)

DWRQueryDaoImpl:

[java]@H_403_19@ view plain copy
  1. publicList<News>getNewsListByTitle(Stringtitle,Stringcolid){
  2. try{
  3. Stringhql="fromNewsasowhereo.titlelike'%"+title.trim()+"%'ando.pubstate='已发布'ando.newscolumn.id='"+colid.trim()+"'orderbypubstatedesc";
  4. return(List<News>)super.getHibernateTemplate().find(hql);
  5. }catch(RuntimeExceptionre){
  6. throwre;
  7. }
  8. }
  9. publicList<News>getNewsListByPage(finalStringtitle,finalStringcolid,finalintpageNo,finalintpagesize){
  10. finalMap<String,List<News>>map=newHashMap<String,List<News>>();
  11. try{
  12. super.getHibernateTemplate().execute(newHibernateCallback<List<News>>()
  13. {
  14. publicList<News>doInHibernate(Sessionsession)throwsHibernateException,sqlException
  15. {
  16. Stringhql="fromNewsasowhereo.titlelike'%"+title.trim()+"%'ando.pubstate='已发布'ando.newscolumn.id='"+colid.trim()+"'orderbypubstatedesc";
  17. Queryquery=session.createQuery(hql);
  18. intfirstindex=(pageNo-1)*pagesize;
  19. query.setFirstResult(firstindex).setMaxResults(pagesize);
  20. Listlist=query.list();
  21. map.put("map",list);
  22. returnnull;
  23. }
  24. });
  25. ListreturnList=map.get("map");
  26. returnreturnList;
  27. }catch(RuntimeExceptionre){
  28. throwre;
  29. }
  30. }


DWRQuery :

[java]@H_403_19@ view plain copy
  1. publicMapdwrQuery(Stringtitle,Stringcolid,intpageNo){
  2. List<News>list=newArrayList<News>();
  3. list=qes.getNewsListByTitle(title,colid);
  4. //获得总记录数
  5. IntegerrecordCount=list.size();
  6. //总页数
  7. intpageCount=(int)Math.ceil(recordCount.doubleValue()/this.getPagesize());
  8. list.clear();
  9. list=qes.getNewsListByPage(title,colid,pageNo,this.getPagesize());
  10. Mapmap=newHashMap();
  11. map.put("recordCount",recordCount);//总记录数
  12. map.put("pageSize",this.getPagesize());//每页显示
  13. map.put("pageCount",pageCount);//总页数
  14. map.put("dataList",list);//新闻集合
  15. returnmap;
  16. }


页面

@H_403_19@

[xhtml]@H_403_19@ view plaincopy@H_403_19@
  1. <!--DWRJS-->@H_403_19@
  2. <scripttype="text/javascript">@H_403_19@
  3. @H_403_19@
  4. currentPage=1;//当前页码全局变量@H_403_19@
  5. functionchangtable(pageNo){@H_403_19@
  6. if(pageNo<1){@H_403_19@
  7. pageNo=1;//当前页为1@H_403_19@
  8. }@H_403_19@
  9. currentPage=pageNo;//根据当前页数修改全局变量@H_403_19@
  10. varquerytitle=document.getElementById("querytitle");//这里是查询字段@H_403_19@
  11. //这里调用DWRQuery的dwrQuery方法@H_403_19@
  12. showList.dwrQuery(querytitle.value,callBackMethod);@H_403_19@
  13. }@H_403_19@
  14. @H_403_19@
  15. functioncallBackMethod(map){@H_403_19@
  16. varshowmsg=document.getElementById("showmsg");@H_403_19@
  17. varcolname=document.getElementById("colname").value;@H_403_19@
  18. showmsg.innerHTML="";@H_403_19@
  19. DWRUtil.removeAllRows("tablebody");@H_403_19@
  20. //没有查询到相应记录@H_403_19@
  21. if(map['dataList'].length==0){@H_403_19@
  22. showmsg.innerHTML="<fontcolor='red'>没有查询到相应记录!</font>";@H_403_19@
  23. }else{@H_403_19@
  24. //这里调用的DWRUtil.addRows方法可以参考我的上一篇文章@H_403_19@
  25. DWRUtil.addRows("tablebody",map['dataList'],@H_403_19@
  26. [@H_403_19@
  27. function(item){@H_403_19@
  28. return"&nbsp;<inputtype='checkBox'name='checkBox'value='"+item.id+"'/>"@H_403_19@
  29. },@H_403_19@
  30. function(item){@H_403_19@
  31. return"&nbsp;&nbsp;<atarget='_blank'href="pubnews!looknew.action?id="+item.id+"'>"+item.title+"</a>"@H_403_19@
  32. @H_403_19@
  33. },@H_403_19@
  34. function(item){return"&nbsp;&nbsp;"+item.creater},@H_403_19@
  35. function(item){return"&nbsp;&nbsp;"+item.checks}@H_403_19@
  36. ],@H_403_19@
  37. {escapeHtml:false});@H_403_19@
  38. }@H_403_19@
  39. @H_403_19@
  40. showPageBar(map,currentPage);//根据全局当前页数调用显示页面导航的函数@H_403_19@
  41. }@H_403_19@
  42. @H_403_19@
  43. @H_403_19@
  44. //显示页码导航@H_403_19@
  45. functionshowPageBar(map,pageNo){@H_403_19@
  46. varpageBar=document.getElementById("pageDiv");@H_403_19@
  47. varrecordCount=map['recordCount'];//总记录数@H_403_19@
  48. varpageSize=map['pageSize'];//每页显示记录数@H_403_19@
  49. varpageCount=map['pageCount'];//总页数@H_403_19@
  50. varpageStr="当前页:第"+pageNo+"页|";@H_403_19@
  51. pageStr+="总记录数:"+recordCount+"条|";@H_403_19@
  52. pageStr+="每页显示:"+pageSize+"条|";@H_403_19@
  53. pageStr+="总页数:"+pageCount+"页|";@H_403_19@
  54. if(pageNo==1){@H_403_19@
  55. pageStr+="首页上一页";@H_403_19@
  56. }else{@H_403_19@
  57. pageStr+="<ahref="javascript:changtable(1)">首页</a>@H_403_19@
  58. <ahref="javascript:changtable("+(pageNo-1)+")">上一页</a>";@H_403_19@
  59. }@H_403_19@
  60. if(pageNo<pageCount){@H_403_19@
  61. pageStr+="<ahref="javascript:changtable("+(pageNo+1)+")">@H_403_19@
  62. 下一页</a><ahref="javascript:changtable("+pageCount+")">末页</a>";@H_403_19@
  63. }else{@H_403_19@
  64. pageStr+="下一页末页";@H_403_19@
  65. }@H_403_19@
  66. pageStr+="&nbsp;";@H_403_19@
  67. pageBar.innerHTML=pageStr;@H_403_19@
  68. }@H_403_19@
  69. //引入dwr的js库文件@H_403_19@
  70. <scripttype='text/javascript'src='dwr/interface/showList.js'></script>@H_403_19@
  71. <scripttype='text/javascript'src='dwr/engine.js'></script>@H_403_19@
  72. <scripttype='text/javascript'src='dwr/util.js'></script>@H_403_19@
  73. //展示列表@H_403_19@
  74. <tablealign="center">@H_403_19@
  75. <tbody>@H_403_19@
  76. <tr>@H_403_19@
  77. <thwidth="28px">@H_403_19@
  78. <inputtype="checkBox"id="allche"value="checkBox"@H_403_19@
  79. title="全选/全不选"onclick="allChoose();changeIds();">@H_403_19@
  80. </th>@H_403_19@
  81. <th>@H_403_19@
  82. 标题@H_403_19@
  83. </th>@H_403_19@
  84. <th>@H_403_19@
  85. 录入者@H_403_19@
  86. </th>@H_403_19@
  87. <th>@H_403_19@
  88. 点击数@H_403_19@
  89. </th>@H_403_19@
  90. </tr>@H_403_19@
  91. </tbody>@H_403_19@
  92. <tbodyid="tablebody">@H_403_19@
  93. </tbody>@H_403_19@
  94. </table>@H_403_19@
  95. <divid="showmsg"align="center">@H_403_19@
  96. </div>@H_403_19@
  97. <divid="pageDiv"align="right">@H_403_19@
  98. </div>@H_403_19@

//最终实现的分页效果

当前页: 1 |总记录数: 21 |每页显示: 10 |总页数: 3 |上一页下一页

DWR整合SSH大致总结到这里,粘了比较多的代码。希望能给有类似需求的朋友们提供一点点帮助。

猜你在找的Ajax相关文章