前端之家收集整理的这篇文章主要介绍了
使用DWR 轻轻松松实现Ajax实现分页,
前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
建站学院(LieHuo.Net)文档 本教程中是以DWR(AJAX的一种Java实现)做的分页!
1.以下是DWR的配置
(1)在web.xml中配置DWRServlet如下:
以下为引用的内容: <servlet> <servlet-name>dwr-invoker</servlet-name> <display-name>DWR Servlet</display-name> <description>Direct Web Remoter Servlet</description> <servlet-class>uk.ltd.getahead.dwr.DWRServlet</servlet-class> <init-param> <param-name>debug</param-name> <param-value>true</param-value> </init-param> </servlet> <servlet-mapping> <servlet-name>dwr-invoker</servlet-name> <url-pattern>/dwr/*</url-pattern> </servlet-mapping> |
(2)在dwr.xml中配置
以下为引用的内容: <dwr> <allow> <create javascript="GetPages" creator="new"> <param name="class" value="com.GetPages"></param> </create> <convert match="com.PageBean" converter="bean"> <param name="include" value="job_id,job_desc,min_lvl,max_lvl"></param> </convert> </allow> </dwr> |
2.编写PageBean以存放要显示的数据
以下为引用的内容: private String job_id; private String job_desc; private String min_lvl; private String max_lvl; |
3.编写getPage类实现分页,代码如下:
以下为引用的内容: public int getFirst(int page) { pages=page; return pages; } public int getNext(int page) { if(page==pageCount) { return pageCount; }else { pages=page; return pages+1; } } public int getUp(int page) { if(page==1) { return pages; }else { pages=page; return pages-1; } } public int getLast(int page) { return pageCount; } public List<PageBean> getJobs(int page) { list=new ArrayList<PageBean>(); String sql; con=connect.getCon(); try { stm=con.createStatement(); if(page==1) { sql="select top 5 * from jobs"; }else { sql="select top 5 * from jobs where job_id not in (select top "+5*(page-1)+" job_id from jobs)"; } rs=stm.executeQuery(sql); while(rs.next()) { pb=new PageBean(); pb.setJob_id(rs.getString("job_id").toString()); pb.setJob_desc(rs.getString("job_desc").toString()); pb.setMin_lvl(rs.getString("min_lvl").toString()); pb.setMax_lvl(rs.getString("max_lvl").toString()); list.add(pb); } } catch (sqlException e) { // TODO Auto-generated catch block e.printStackTrace(); } return list; } |
4.新建个页面调用getPage类中的方法
以下为引用的内容: <html> <head> <script type="text/javascript" src="dwr/util.js"></script> <script type="text/javascript" src="dwr/engine.js"></script> <script type="text/javascript" src="dwr/interface/GetPages.js"></script> <script type="text/javascript"> var page=1; function first() { GetPages.getFirst(1,callback); } function callback(pages) { page=pages; GetPages.getJobs(pages,process); } function next() { GetPages.getNext(page,callback); } function up() { GetPages.getUp(page,callback); } function last() { GetPages.getLast(page,callback); } function process(item) { DWRUtil.removeAllRows("job"); var cell=[ function(item){return item.job_id}, function(item){return item.job_desc}, function(item){return item.min_lvl}, function(item){return item.max_lvl} ]; DWRUtil.addRows("job",item,cell); } </script> </head> <body onload="javaScript:first();"> <table border="1"> <tbody id="job"> </tbody> </table> <a href="javaScript:first()">第一页</a> <a href="javaScript:up()">上一页</a> <a href="javaScript:next()">下一页</a> <a href="javaScript:last()">最后一页</a> </body> </html> |