Vincent.Chan‘s Blog

常用链接

统计

积分与排名

网站

最新评论

关于分页设计的一些做法

做web时,经常要面对分页这一问题,我也不知道究竟哪一种最好,就把想到的列出来:
第一种:先把所有数据都从服务器端获取到客户端,然后在web端进行分页处理。但是对于一些很大数据量的列表,无疑效率很低的,用户要等上好久才能见到效果(即使你用AJAX,它只能是用户避免见到空白页);但这种做法减少了和服务器的交互。
第二种:就是通过条件控制,web端仅获取一页的数据量,它提高了访问服务器的效率,速度比较快,但是加大了访问服务器的频率。
我们用的比较多的是第二种。但还有一个问题,分页的时候,要知道总共的页数,有两种做法:
  第一种:在web端调用两次服务端,一次获取当前页的数据,再一次获取总共的页数等信息。
  第二种:在服务端包装数据列表和总共的页数信息,返回的仅是一个对象,然后到web端进行拆解。
比方说,用一个VO存放List和totalPage,可以把totalPage存放在另一个VO中,以便于以后的扩展。

不同的数据库有不同的专业分页语句。我们最常用的是oracle(参考hibernate):

public String getLimitString(String sql) {
  StringBuffer pagingSelect = new StringBuffer(100);
  pagingSelect.append("select * from ( select row_.*, rownum rownum_ from ( ");
  pagingSelect.append(sql);
  pagingSelect.append(" ) row_ where rownum <= ?) where rownum_ > ?");
  return pagingSelect.toString();
}

MySql中的:

public String getLimitString(String sql) {
  StringBuffer pagingSelect = new StringBuffer(100);
  pagingSelect.append(sql);
  pagingSelect.append(" limit ?, ?");
  return pagingSelect.toString();
}

下面是jsp中的一些分页代码(采用第二种):

<script language="JavaScript">
//实现分页功能 示例
//  function forwardpage(page)
//    {
//        window.location="<!--%=request.getContextPath()%-->/.do?op=&cp="+page;//    }
    function selectPage(){
      var thePage = document.all("spage").value;
      if(thePage<1){
        alert("请选择一页!");
      }else{
        turnToPage(thePage);
      }
    }
</script>
 <%
     String totalPage = (String) request.getAttribute("totalPage");
     String currentNum = request.getParameter("cp");
     int cp = 0;
     int pageNum = 0;
     if(totalPage==null||totalPage.equals("")){
       totalPage = "10";
     }
     pageNum = Integer.parseInt(totalPage);
     if(currentNum == null || currentNum.trim().equals("")){
       cp = 1;
     }else{
       cp = Integer.parseInt(currentNum);
     }
     currentNum = null;
     totalPage = null;
%>

<table width="100%" border="0">
   <tr>
      <td>共<%=pageNum%>页</td>
      <td></td>
  <% if(cp == 1){ %>
      <td  width="30" align="center" align="center"><IMG alt=第一页
                            src="<%=request.getContextPath()%/public/images/splitpage/unfirstpg.gif"></td>

      <td  width="20" align="center"><IMG
                            alt=上一页 src="<%=request.getContextPath()%>/public/images/splitpage/unpreviouspg.gif">
      </td>
  <%
    }
    else
    {
  %>
      <td  width="20" align="center"><IMG alt=第一页
                            src="<%=request.getContextPath()%>/public/images/splitpage/firstpg.gif" onclick="forwardpage('1')" style="cursor:hand"></td>

      <td width="20" align="center"><IMG
                            alt=上一页 src="<%=request.getContextPath()%>/public/images/splitpage/previouspg.gif" onclick="forwardpage('<%=cp-1%>')" style="cursor:hand">
      </td>
   <%
    }

    if(cp == pageNum){
  %>

      <td  width="20" align="right"><IMG  alt=下一页
                            src="<%=request.getContextPath()%>/public/images/splitpage/unnextpg.gif">
      </td>

      <td  width="20" align="right"><IMG  alt=最后一页
                            src="<%=request.getContextPath()%>/public/images/splitpage/unlastpg.gif"></td>

  <% }
     else{
  %>

      <td width="20" align="right"><IMG  alt=下一页
                            src="<%=request.getContextPath()%>/public/images/splitpage/nextpg.gif" onclick="forwardpage('<%=cp+1%>')" style="cursor:hand">
      </td>

      <td class="redbutton" width="20" align="right"><IMG  alt=最后一页
                            src="<%=request.getContextPath()%>/public/images/splitpage/lastpg.gif" onclick="forwardpage('<%=pageNum%>')" style="cursor:hand"></td>

  <%   }   %>

      <td  width="20">&nbsp;</td>
      <td>跳转到<select name="spage" onchange="selectPage()"><%
         for(int pi=1;pi<=pageNum;pi++){
           %>
           <option value="<%=pi%>"><%=pi%></option>
           <%
         }
      %></select>页</td>
   </tr>
</table>

posted on 2006-02-14 20:57 Vincent.Chen 阅读(335) 评论(0)  编辑  收藏 所属分类: Java


只有注册用户登录后才能发表评论。


网站导航: