如何用JS将数据在页面上分页显示出来

JavaScript021

如何用JS将数据在页面上分页显示出来,第1张

在servlet的service()方法中只需进行如下操作:

PageControl  pageCtl = yourBusinessObject.listData(req.getParameter("jumpPage"))

req.setAttribute("pageCtl",pageCtl)

说明:yourBusinessObject封装了商业逻辑,是位于Business Logic Layer中的一个对象,运用OOAD的方法,封装商业对象,在Persistent Layer之上组建坚实的Business Logic Layer同样是构建大型电子商务架构的关键所在。本文的关注点只是分页处理,暂不详细论述.

在每个想要实现翻页显示数据的jsp页面中,我们的工作也很简单,其代码是公式化的:

<jsp:useBean id="pageCtl" class="yourpackage.PageControl" scope="request"></jsp:useBean>

<%if(pageCtl.maxPage!=1)){%>

<form name="PageForm"  action="/servlet/yourpackage.yourservlet" method="post">

<%@ include file="/yourpath/pageman.jsp"%>

</form>

<%}%>

说明:

if(pageCtl.maxPage!=1)实现了这样一个逻辑:如果所取得数据不足一页,那么就不用进行翻页显示。

我们注意到<%@ include file="/yourpath/pageman.jsp"%>这使得真正的翻页部分完全得到了重用.

那么pageman.jsp到底做了些什么呢?它实现了经常做翻页处理的人耳熟能详的逻辑 

(A)第一页时不能再向前翻; 

(B)最后一页时不能再向后翻; 

同时能够进行页面任意跳转,具体代码如下:

每页<%=pageCtl.rowsPerPage%>行

共<%=pageCtl.maxRowCount%>行

第<%=pageCtl.curPage%>页

共<%=pageCtl.maxPage%>页

<BR>

<%if(pageCtl.curPage==1){ out.print(" 首页 上一页")  }else{  %> 

<A HREF="javascript:gotoPage(1)">首页</A>

<A HREF="javascript:gotoPage(<%=pageCtl.curPage-1%>)">上一页</A>

<%}%>

<%if(pageCtl.curPage==pageCtl.maxPage){ out.print("下一页 尾页")  }else{  %> 

<A HREF="javascript:gotoPage(<%=pageCtl.curPage+1%>)">下一页</A>

<A HREF="javascript:gotoPage(<%=pageCtl.maxPage%>)">尾页</A>

<%}%>

转到第<SELECT name="jumpPage" onchange="Jumping()">

    <% for(int i=1i<=pageCtl.maxPagei++)  {

    if (i== pageCtl.curPage){

    %>

    <OPTION selected value=<%=i%>><%=i%></OPTION>

    <%}else{%>

    <OPTION value=<%=i%>><%=i%></OPTION>

    <%}}%> 

    </SELECT>页

最后附上用于页面跳转的javascript公共函数:

function Jumping(){

 document.PageForm.submit()

 return

}

function gotoPage(pagenum){

 document.PageForm.jumpPage.value = pagenum

 document.PageForm.submit()

 return

}

运行效果:

create proc proc_insertstu

@sid int,@sname varchar(20),@ssex varchar(6),@sage int

as

insert into stu values(@sid,@sname,@ssex,@sage)

go

java调用:

public boolean insertStu(Student stu)

{

CallableStatement call=null

try {

call=con.prepareCall("{call proc_insertstu(?,?,?,?)}")

} catch (SQLException e) {

// TODO 自动生成 catch 块

e.printStackTrace()

return false

}

try {

call.setInt(1, stu.getId())

call.setString(2, stu.getName())

call.setString(3, stu.getName())

call.setInt(4, stu.getAge())

call.execute()

} catch (SQLException e) {

// TODO 自动生成 catch 块

e.printStackTrace()

return false

}

return true

}

JSP调用:

<%

DBCon db=new DBCon()

db.getCon()

CallableStatement call=db.con.prepareCall("{call proctest}")

call.execute()

ResultSet rs=call.getResultSet()

%>

<%@ page contentType="text/html charset=gb2312"%>

<%@ page language="java" import="java.sql.*" %>

<%