分頁&高級查詢

 

分頁

真分頁

點擊到那一晚上的數據,咱們就使用範圍查詢javascript

Select * from jobs where ... limit 0,3css

 

假分頁

咱們把全部數據查出來,放到內存中html

 分頁的實現:

咱們建立一個分頁的工具類,前端

package cn.jiedada.util;

import java.util.List;

/**這是一個作分頁的分爲,當前頁,下一頁,上一頁,總頁數,尾頁,首頁,每一頁的大小,
 * 當前頁直接得到
 *         算出總頁數
        this.totalPage = this.totalNum%pageSize==0?this.totalNum/pageSize:this.totalNum/pageSize+1;
        算出前一頁
        this.prePage = this.localPage==1? 1 : this.localPage-1;
        算出後一頁
        this.nextPage = this.localPage==this.totalPage? this.totalPage : this.localPage+1;
 * @author 
 *
 * @param <T>
 */
public class PageBeanUtil<T> {
    
    private Integer localPage;
    //總頁數
    private Integer totalPage;
    //每頁顯示數量
    private Integer pageSize = 5;
    //總數據量
    private Integer totalNum;
    //首頁
    private Integer firstPage = 1;
    //上一頁
    private Integer prePage;
    //下一頁
    private Integer nextPage;
    //尾頁
    private Integer lastPage;
    //顯示的數據
    private List<T> list;

    public PageBeanUtil() {
    }

    public PageBeanUtil(Integer localPage,Integer totalNum) {
        super();
        this.localPage = localPage;
        this.totalNum = totalNum;
        //算出總頁數
        this.totalPage = this.totalNum%pageSize==0?this.totalNum/pageSize:this.totalNum/pageSize+1;
        //算出前一頁
        this.prePage = this.localPage==1? 1 : this.localPage-1;
        //算出後一頁
        this.nextPage = this.localPage==this.totalPage? this.totalPage : this.localPage+1;
        
        this.lastPage = this.totalPage;
    }

    public Integer getLocalPage() {
        return localPage;
    }

    public void setLocalPage(Integer localPage) {
        this.localPage = localPage;
    }

    public Integer getTotalPage() {
        return totalPage;
    }

    public void setTotalPage(Integer totalPage) {
        this.totalPage = totalPage;
    }

    public Integer getPageSize() {
        return pageSize;
    }

    public void setPageSize(Integer pageSize) {
        this.pageSize = pageSize;
    }

    public Integer getTotalNum() {
        return totalNum;
    }

    public void setTotalNum(Integer totalNum) {
        this.totalNum = totalNum;
    }

    public Integer getFirstPage() {
        return firstPage;
    }

    public void setFirstPage(Integer firstPage) {
        this.firstPage = firstPage;
    }

    public Integer getPrePage() {
        return prePage;
    }

    public void setPrePage(Integer prePage) {
        this.prePage = prePage;
    }

    public Integer getNextPage() {
        return nextPage;
    }

    public void setNextPage(Integer nextPage) {
        this.nextPage = nextPage;
    }

    public Integer getLastPage() {
        return lastPage;
    }

    public void setLastPage(Integer lastPage) {
        this.lastPage = lastPage;
    }

    public List<T> getList() {
        return list;
    }

    public void setList(List<T> list) {
        this.list = list;
    }

    @Override
    public String toString() {
        return "PageBeanUtil [localPage=" + localPage + ", totalPage=" + totalPage + ", pageSize=" + pageSize
                + ", totalNum=" + totalNum + ", firstPage=" + firstPage + ", prePage=" + prePage + ", nextPage="
                + nextPage + ", lastPage=" + lastPage + ", list=" + list + "]";
    }
    
    
}
View Code

經過這裏面的構造方法,就能直接封裝爲一個對象,這裏面都能經過計算得到,可是tolalNum是須要咱們去查詢數據庫的java

在service層中咱們作的語句爲jquery

@Override
    public PageBeanUtil<Jobs> page(Integer localPage) {
                //查詢中條數
        Integer totalNum = dao.findNum();
        if(localPage==null){
            localPage=1;
        }
        //構造方法
        PageBeanUtil<Jobs> pageBean = new PageBeanUtil<Jobs>(localPage, totalNum);
        //查詢
        List<Jobs> list = dao.selectLimt((localPage-1)*pageBean.getPageSize(),pageBean.getPageSize());
        pageBean.setList(list);
        return pageBean;
    }            
View Code
@Override
    public Integer findNum() {
        return template.queryForObject("select count(id) from jobs", Integer.class);
    }

    @Override
    public List<Jobs> selectLimt(int index, Integer pageSize) {
        // TODO Auto-generated method stub
        return template.query("SELECT * FROM view_jobs_city LIMIT ?,?", new BeanPropertyRowMapper<Jobs>(Jobs.class),index,pageSize);
    }
View Code

這是dao層的git

 

<div class="container job-table">
            <table class="table table-hover">
                <tr>
                    <th class="hidden-sm">編號</th>
                    <th>工做職位</th>
                    <th>地點</th>
                    <th>人數</th>
                    <th>薪資待遇</th>
                    <th>是否啓用</th>
                    <th>發佈時間</th>
                    <th>操做</th>
                </tr>
                <c:forEach items="${pageBean.list }" var="j">
                    <tr>
                        <th>#${j.id }</th>
                        <th>${j.title }</th>
                        <th>${j.cname }</th>
                        <th>${j.jobnum }</th>
                        <th>${j.treatment }</th>
                        <th>
                            <c:if test="${j.isenabled }" var="s">    
                                <span class="glyphicon glyphicon-ok" aria-hidden="true"></span>
                            </c:if>
                            <c:if test="${!s }">
                                <span class="glyphicon glyphicon-remove" cia-hidden="true"></span>
                            </c:if>
                        </th>
                        <th>${j.inputdate }</th>
                        <th>
                            <a href="system/jobs/update?id=${j.id }" class="btn-default tableA"><span class="glyphicon glyphicon-pencil" aria-hidden="true">修改</span></a>
                            <a href="system/jobs/del?id=${j.id }" class="btn-default tableA"><span class="glyphicon glyphicon-trash" aria-hidden="true">刪除</span></a>
                        </th>
                    </tr>
                </c:forEach>
            </table>
            <!--分頁-->
            <nav class="navbar-right">
                <ul class="pagination" id="paging">
                    <li>
                        <span>當前第${pageBean.localPage }頁</span>
                    </li>
                    <li>
                        <a href="system/jobs/page?localPage=1">
                            <span aria-hidden="true">首頁</span>
                        </a>
                    </li>
                    <li>
                        <a href="system/jobs/page?localPage=${pageBean.prePage }" aria-label="上一頁">
                            <span aria-hidden="true">上一頁</span>
                        </a>
                    </li>
                    <li>

                    </li>
                    <li>
                        <a href="system/jobs/page?localPage=${pageBean.nextPage }" aria-label="下一頁">
                            <span aria-hidden="true">下一頁</span>
                        </a>
                    </li>
                    <li>
                        <a href="system/jobs/page?localPage=${pageBean.lastPage }" aria-label="尾頁">
                            <span aria-hidden="true">尾頁</span>
                        </a>
                    </li>
                    <li>
                        <span>總頁數:共${pageBean.totalPage }頁</span>
                        <span>總數據:共${pageBean.totalNum }條</span>
                    </li>
                </ul>
            </nav>
        </div>
    </body>
View Code

 

這是前端頁面的數據反饋web

 

高級查詢

 

 

 

 咱們輸入內容返回相應的數據,還要查看職位是否發佈spring

咱們能夠有4中狀況,這裏咱們怎麼處理sql語句呢?sql

作一個工具類,判斷咱們須要使用的sql

package cn.jiedada.util;

/**爲了判斷傳入參數,改變sql語句,主要用於前端職位,是否全職查詢
 * 的是否是
 * getCondition經過該方法得到
 * @author 傑大大是真滴帥
 *
 */
public class JobsCondition {
    // 職位名稱
    private String title;
    // 職位類型
    //
    private Integer positiontype;
    public static String getCondition(String title,Integer positiontype) {
        //SELECT * FROM view_jobs_city where isenabled = 1 and title like  '%會%'
        //這裏最好爲""由於後面拼接的時候能夠拼接多種,不要寫死了
        String sql=" ";
        if(title!=null && !title.trim().equals("")){
            sql +=" and title like '%"+title+"%' ";
        }if(positiontype!=null){
            sql +=" and positiontype ="+positiontype+" ";
        }
        return sql;
        
    }
    public JobsCondition() {
    }
    public String getTitle() {
        return title;
    }
    public void setTitle(String title) {
        this.title = title;
    }
    public Integer getPositiontype() {
        return positiontype;
    }
    public void setPositiontype(Integer positiontype) {
        this.positiontype = positiontype;
    }
    @Override
    public String toString() {
        return "JobsCondition [title=" + title + ", positiontype=" + positiontype + "]";
    }
    
    
}
View Code

 

控制層代碼

package cn.jiedada.controller.front;

import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.RequestMapping;

import cn.jiedada.damain.Jobs;
import cn.jiedada.service.IJobsService;
import cn.jiedada.util.JobsCondition;
import cn.jiedada.util.PageBeanUtil;

@Controller
@RequestMapping("/jobs")
public class JobsController {
    @Autowired
    private IJobsService service;
    
    @RequestMapping("/page")
    public String type(Integer localPage,Model model,JobsCondition condition) {
        PageBeanUtil<Jobs> pageBean = service.page(localPage,condition);
        model.addAttribute("pageBean",pageBean);
        model.addAttribute("condition", condition);
        return "join_us_info";
    }
}
View Code

服務層的代碼

@Override
    public PageBeanUtil<Jobs> page(Integer localPage, JobsCondition condition) {
        String sql = JobsCondition.getCondition(condition.getTitle(), condition.getPositiontype());
        Integer totalNum = dao.indeFindNum(sql);
        if(localPage==null){
            localPage=1;
        }
        PageBeanUtil<Jobs> pageBean = new PageBeanUtil<Jobs>(localPage, totalNum);
        List<Jobs> list = dao.selectLimt((localPage-1)*pageBean.getPageSize(), pageBean.getPageSize(),sql);
        pageBean.setList(list);
        return pageBean;
    }
View Code

前端數據接收

<%@ page pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<!DOCTYPE html>
<html>

    <head>
        <base href="${pageContext.request.contextPath }/">
        <meta charset="UTF-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <!-- 上述3個meta標籤*必須*放在最前面,任何其餘內容都*必須*跟隨其後! -->
        <title>源碼物流校招</title>
        <link rel="stylesheet" href="css/bootstrap-theme.min.css" />
        <!--引入bootstrap樣式文檔-->
        <link rel="stylesheet" href="css/bootstrap.min.css" />

        <script type="text/javascript" src="js/jquery.min.js"></script>
        <script type="text/javascript" src="js/bootstrap.min.js"></script>
        <link rel="stylesheet" href="css/commons.css" />
    </head>

    <body>
        <!--導航條-->
        <nav class="navbar navbar-inverse navbar-fixed-top">
            <div class="container">
                <!-- 導航上Logo和目錄顯示 -->
                <div class="navbar-header">
                    <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#index-navbar" aria-expanded="false">
                               <span class="sr-only">導航目錄</span>
                            <span class="icon-bar"></span>
                            <span class="icon-bar"></span>
                            <span class="icon-bar"></span>
                          </button>
                    <a class="navbar-brand" href="javascript:void(0);">源碼物流校園招聘網</a>
                </div>

                <!-- 導航上其餘按鈕-->
                <div class="collapse navbar-collapse navbar-right" id="index-navbar">
                    <ul class="nav navbar-nav">
                        <li>
                            <a href="index.html">首頁</a>
                        </li>
                        <li>
                            <a href="about.html">走進源碼</a>
                        </li>
                        <li>
                            <a href="talents.html">人才發展</a>
                        </li>
                        <li>
                            <a href="javascript:void(0);">職位列表</a>
                        </li>
                        <li>
                            <a href="qa.html">Q&A</a>
                        </li>
                    </ul>
                </div>
                <!-- /.navbar-collapse -->
            </div>
            <!-- /.container-fluid -->
        </nav>
        <!--職位搜索-->
        <div class="container" style="border: 1px solid #dcdcdc;padding-top: 30px;padding-bottom: 30px;margin-top: 60px;">
            <span>
                <img src="imgs/join_us_search.jpg" alt="">
            </span>
            <div class="row" style="padding-top: 30px;">
                <form class="form-inline" action="jobs/page">
                    <div class="form-group col-md-3">
                        <label for="jobTitle">職位名稱</label>
                        <input type="text" class="form-control" name="title" value="${condition.title }" id="jobTitle" placeholder="職位名稱">
                    </div>
                    <div class="form-group col-md-3" style="padding-top: 5px;">
                        <label for="workingTime">工做時間:</label>
                        <label class="radio-inline">
                            <input type="radio" name="positiontype" id="workingTime" value="" 
                            <c:if test="${condition.positiontype==null }">checked="checked"</c:if>> 所有
                        </label>
                        <label class="radio-inline">
                            <input type="radio" name="positiontype" id="workingTime" value="1"
                            <c:if test="${condition.positiontype==1 }">checked="checked"</c:if>
                            > 全職
                        </label>
                        <label class="radio-inline">
                            <input type="radio" name="positiontype" id="workingTime" value="0"
                            <c:if test="${condition.positiontype==0 }">checked="checked"</c:if>
                            > 兼職
                        </label>
                    </div>
                    <button type="submit" class="btn btn-default">搜索職位</button>
                </form>
            </div>
        </div>
        <!--職位列表-->
        <div class="container job-table">
            <span>
                <img src="imgs/index_title_zw.jpg" alt="">
                <img src="imgs/index_title_more.jpg" alt="">
            </span>
            <table class="table table-hover">
                <c:forEach items="${pageBean.list }" var="j">
                    <tr>
                    <th>#${j.id }</th>
                    <th>${j.title }</th>
                    <th>${j.cname }</th>
                    <th>${j.jobnum }</th>
                    <th>${j.treatment }</th>
                    <th>${j.inputdate }</th>
                    <th>
                        <a href="freemakser/${j.htmlurl }">職位詳情</a>
                    </th>
                </tr>
                </c:forEach>
            </table>
            <!--分頁-->
            <nav class="navbar-right">
                <ul class="pagination" id="paging">
                    <li>
                        <span>當前第${pageBean.localPage }頁</span>
                    </li>
                    <li>
                        <a href="jobs/page?localPage=1">
                            <span aria-hidden="true">首頁</span>
                        </a>
                    </li>
                    <li>
                        <a href="javascript:go(${pageBean.prePage })" aria-label="上一頁">
                            <span aria-hidden="true">上一頁</span>
                        </a>
                    </li>
                    <li>

                    </li>
                    <li>
                        <a href="javascript:go(${pageBean.nextPage })" aria-label="下一頁">
                            <span aria-hidden="true">下一頁</span>
                        </a>
                    </li>
                    <li>
                        <a href="javascript:go(${pageBean.lastPage })" aria-label="尾頁">
                            <span aria-hidden="true">尾頁</span>
                        </a>
                    </li>
                    <li>
                        <span>總頁數:共${pageBean.totalPage }頁</span>
                        <span>總數據:共${pageBean.totalNum }條</span>
                    </li>
                </ul>
            </nav>
        </div>
        <!--友情連接  手機端的時候,就隱藏掉-->
        <div class="container hidden-xs hidden-sm" id="footer-link">
            <img src="imgs/index_link_img.jpg" alt="" class="out-border-left">
            <a href="" class="out-border-left">源碼時代官網</a>
            <a href="" class="out-border-left">BootStrap官網</a>
        </div>
        <!--底部-->
        <div class="container-fluid footer-common">
            <p>
                <a href="javascript:void(0);" class="out-border-left">招聘首頁</a>
                <a href="about.html" class="out-border-left">走進源碼</a>
                <a href="talents.html" class="out-border-left">人才發展</a>
                <a href="join_us_info.html" class="out-border-left">職位列表</a>
                <a href="qa.html" class="out-border-left">Q&A</a>
            </p>
            <p>企業郵箱:test@test688.com </p>
            <p>電話熱線:4000-888-888 傳真:020-3333-3333</p>
            <p>公司地址:四川省成都市高新區府城大道西段399號天府新谷1號樓6F</p>
            <p>源碼物流版權全部 Copyright © 2018 jobs.digitalchina.ourats.com All rights reserved.蜀ICP備18080118號-1</p>
        </div>
    </body>
    <script type="text/javascript">
    
        function go(localPage) {
            //傳入參數
            var title='${condition.title }';
            var positiontype='${condition.positiontype }';
            window.location="${pageContext.request.contextPath }/jobs/page?localPage="+localPage+"&title="+title+"&positiontype="+positiontype+"";
        }
    </script>
</html>
View Code
相關文章
相關標籤/搜索