Heim > Artikel > Java > Detaillierte Einführung in die Front-End-Seite und den Hintergrundcode der Java-Implementierung von Paging

Detaillierte Einführung in die Front-End-Seite und den Hintergrundcode der Java-Implementierung von Paging

黄舟Original: 2018-05-26 10:12:032592Durchsuche

In diesem Artikel werden hauptsächlich die Front-End-Seite und der Back-End-Code von Java zur Implementierung von Paging vorgestellt. Er hat einen gewissen Referenzwert.

Die Beispiele in diesem Artikel teilen Java mit allen. Der in der Paginierung angezeigte spezifische Code ist wie folgt:

Schauen wir uns zuerst das Bild an, das ungefähr das Bild darstellt, das auch eine Idee liefert (ps: das SSH Framework wird verwendet)

Detaillierte Einführung in die Front-End-Seite und den Hintergrundcode der Java-Implementierung von Paging

Front-EndJSPSeite

<%@ page language="java" contentType="text/html; charset=utf-8"
 pageEncoding="utf-8"%>
<%@taglib prefix="s" uri="/struts-tags"%>  
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
 <title>数据交易猫</title> 
 <script type="text/javascript"> 

 //1分页下，动态添加disable给分页按钮
 /*
 $(function(){
  var myPageId="#"+$("#hidCurrentPage").val();
  var myPageAId="#"+$("#hidCurrentPage").val()+" a";
  $(myPageAId).addClass(&#39;main-bgcolor&#39;);
  $(myPageAId).attr(&#39;href&#39;,&#39;javascript:void(0)&#39;)
  $(myPageId).addClass(&#39;disabled&#39;);
  $(myPageId).addClass(&#39;disabledControl&#39;);

 })
 */
 //
 $(function(){

 })
 //根据页数查询数据列表
 function queryRequirListByPage(i) {
  var pageNo=i;
  var sortValue=$(&#39;#hidSortValue&#39;).val();
  $.ajax({
   url:&#39;${pageContext.request.contextPath}/bid/reAction_queryRequirListByPage.action&#39;,
   type:&#39;POST&#39;,
   data:{
    sortValue:sortValue,
    pageNo:pageNo
   },
   success:function(datas){ 
    $(&#39;#requireContentp&#39;).html(datas);          
   },
   error:function(){
    alert("失败");
   },
   });
 }

 //根据下拉查询数据列表
 function selectPage(obj){
  var pageNo=obj.options[obj.selectedIndex].value;
  var sortValue=$(&#39;#hidSortValue&#39;).val();
  $.ajax({
   url:&#39;${pageContext.request.contextPath}/bid/reAction_queryRequirListByPage.action&#39;,
   type:&#39;POST&#39;,
   data:{
    sortValue:sortValue,
    pageNo:pageNo
   },
   success:function(datas){ 
    $(&#39;#requireContentp&#39;).html(datas);          
   },
   error:function(){
    alert("失败");
   },
   });
  }
 //根据下拉选择排序方式
 function selectSort(obj){
  var sortValue = obj.options[obj.selectedIndex].value;
  var pageNo =1;
  $.ajax({
   url:&#39;${pageContext.request.contextPath}/bid/reAction_queryRequirListByPage.action&#39;,
   type:&#39;POST&#39;,
   data:{sortValue:sortValue,
     pageNo:pageNo
    },
   success:function(datas){ 
    $(&#39;#requireContentp&#39;).html(datas);


   },
   error:function(){
    alert("失败");
   },
   });
  }

  $(document).ready(function(){
   var backSortValue=$(&#39;#backSortValue&#39;).val();
   console.log("backSortValue"+backSortValue)
   $("#category option").each(function(){
    var thisId=&#39;#&#39;+this.id;
    var thisValue=this.value;
    if(backSortValue==thisValue){
     $(thisId).attr(&#39;selected&#39;,&#39;selected&#39;);
    }
   });
  })
 </script> 
</head>
<body>

    <!-- 内容-->
    <p class="well">
    <!-- 标题-->
     <p class="box"><h3><span class="glyphicon glyphicon-list" ></span>需求列表</h3></p>
    <!-- 筛选条件--> 
     <p class="box">
      <p class="row">
       <p class="col-xs-12">        
         <span>筛选：按</span>
         <select id="category" name="category" onchange="selectSort(this)">
          <option id="categoryTime" value="publishDatetime">最新</option>
          <option id="categoryPrice" value="price">价格降序</option>
          <input id="backSortValue" type="hidden" value="${sortValue}">
         </select>
         <hr class="mrgZero mrgTopSma"/>
       </p>
      </p>
     </p>     
    <!-- 内容-->
      <input type="hidden" name="hidCurrentPage2" id="hidCurrentPage" value="${currentPage}">
      <input type="hidden" id="hidAllPage" value="${allPage}">
      <input type="hidden" id="hidSortValue" value="${sortValue}">
      <s:iterator value="#requiList">

      <p class="data-down-box">
       <p class="row">
        <p class="col-xs-12">
         <h4 class="ellipsis"><a href="${pageContext.request.contextPath}/bid/bidAction_queryById?id=${id}" 
         rel="external nofollow" onclick="reward()">${title}</a></h4>
        </p>                         
       </p>
       <p class="row mrgTopSma">
        <p class="col-xs-12 ">      
         <p class="data-provider padLeftBig sec-color ellipsis">悬赏积分：<span>${price}</span></p>
         <p class="data-intro padLeftBig ellipsis sec-color">需求描述：<span>${requirementDescription}</span></p>
        </p>    
       </p>
       <hr/>  
      </p>

      </s:iterator>
     <!-- 分页 -->
     <p id="rePagerp" class="rePagerp box">
      <nav>
       <ul class="pager">

        <!-- 判断当前页是否位1，如果不为1则显示上一页， --> 
        <s:if test="1 == #currentPage">  
        </s:if>
        <s:else>
        <li>  
         <a href="javascript:void(0)" rel="external nofollow" rel="external nofollow" rel="external nofollow" 
         rel="external nofollow" aria-label="Previous" onclick="queryRequirListByPage(${currentPage-1})">
         <span aria-hidden="true">«</span>
         </a>
        </li>  
        </s:else>

       <!-- 首页 -->        
       <li><a href="javascript:void(0)" rel="external nofollow" rel="external nofollow" rel="external nofollow" 
       rel="external nofollow" onclick="queryRequirListByPage(1)">首页</a></li>

       <li>
        <span><span class="main-color">${currentPage}</span>/ ${allPage}页</span>        
       </li>

       <!-- 尾页 -->        
       <li><a href="javascript:void(0)" rel="external nofollow" rel="external nofollow" rel="external nofollow" 
       rel="external nofollow" onclick="queryRequirListByPage(${allPage})">尾页</a></li>

       <!-- 判断当前页和总页数，小于则显示下一页， --> 
       <s:if test="#currentPage < #allPage">
        <li>
         <a href="javascript:void(0)" rel="external nofollow" rel="external nofollow" rel="external nofollow" 
         rel="external nofollow" aria-label="Next" onclick="queryRequirListByPage(${currentPage+1})">
         <span aria-hidden="true">»</span>
         </a>
        </li>
       </s:if>
       <li>
        <span class="skipPageSpan">跳转到第 
        <select onchange="selectPage(this)">
         <s:iterator var="lst" begin="1" end="#allPage" step="1">          
          <s:if test="%{#lst == #currentPage}">
           <option selected="selected" value="<s:property/>" ><s:property/></option>  
           </s:if>
           <s:else>
            <option value="<s:property/>" ><s:property/></option>
           </s:else>
         </s:iterator>                    
        </select>
         页
        </span>
        </li>

       </ul>
      </nav>

     </p>      


     </p>     

 <hr/>

</body>
</html>

Aktion

 //查询需求列表
 public String queryRequirListByPage(){
  int pageSize=5;//每页记录
  String hql="select r from Requirement r where r.reStatus !=2 ";
  if(sortValue == null || sortValue.length() <= 0){
   hql=hql+"order by r.publishDatetime desc";
   ActionContext.getContext().put("sortValue", "publishDatetime"); //当前页码条件
   session.put("sessionReqSortValue","publishDatetime");
  }else{
  hql=hql+"order by r."+sortValue+" desc";
   ActionContext.getContext().put("sortValue", sortValue); //当前页码条件
   session.put("sessionReqSortValue",sortValue);
  }
  long icount=requirementService.countAllRe();//总记录数
  long allPage;//总页数
  //判断是否能整除，能则直接，不能则+1；
  if((icount%pageSize)==0){
   allPage=icount/pageSize;
  }
  else{
   allPage=(icount/pageSize)+1;
  }
  System.out.println("总记录："+icount+"；总页数："+allPage+"；当前页码："+pageNo);
  List<Requirement> requiList=requirementService.queryByPage(hql, pageNo, pageSize);
  ActionContext.getContext().put("requiList", requiList);//需求列表
  ActionContext.getContext().put("icount", icount);//总记录数
  ActionContext.getContext().put("allPage", allPage);//总页数
  ActionContext.getContext().put("currentPage", pageNo); //当前页码
  session.put("sessionCurrentPage", pageNo);
  return "requireContent";

 }

Service

  public long countAllRe() {
  return requirementDao.countAllRe();
 }
  public List<T> queryByPage(String hql, int pageNo, int pageSize) {
  return requirementDao.queryByPage(hql, pageNo, pageSize);
 }

dao

 //这里可能会报错，就是直接查询数据列表（使用了SSH）
 public long countAll() {
  List<?> l = getSession().createQuery("select count(*) from "
    + clazz.getSimpleName()).list();
  if (l != null && l.size() == 1 )
  {
   return (Long)l.get(0);
  }
  return 0;
 }
 public List<T> queryByPage(String hql, int pageNo, int pageSize) {
  return getSession()
    .createQuery(hql)
    .setFirstResult((pageNo - 1) * pageSize)
    .setMaxResults(pageSize)
    .list();
 }

Das obige ist der detaillierte Inhalt vonDetaillierte Einführung in die Front-End-Seite und den Hintergrundcode der Java-Implementierung von Paging. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Java ssh

Stellungnahme：

Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn

Vorheriger Artikel：Detaillierte Erläuterung des Beispielcodes der Java EasyUI-Baumtabelle TreeGrid (Bild)Nächster Artikel：Detaillierte Erläuterung des Beispielcodes der Java EasyUI-Baumtabelle TreeGrid (Bild)

In Verbindung stehende Artikel

Mehr sehen