javaWeb原生后端条件分页查询

林同学正在努力

已于 2023-10-30 20:55:02 修改

阅读量551

点赞数 16

文章标签： java

于 2023-10-30 17:22:44 首次发布

本文链接：https://blog.csdn.net/weixin_63975657/article/details/134121168

版权

文章目录

概要

条件分页查询,使用技术:mybatis,servlet,jsp

后端分页的整体流程

前端向后端提交请求,后端响应数据给前端,将数据展示在前端页面中

(1)前端页面

如图所示,我们需要的数据:

响应的数据:我们需要将后端传来的信息回显至前端页面中(需要一个List集合存储)

总记录数: 后台数据库查询后给出总记录数(需要变量记录总记录数)

总页码:可以根据总记录数以及每页显示的条数算出一共有多少个页码(需要变量计算总页码)

当前页:根据该页码让后台知道需要的数据

每页显示条数:可以设置下拉菜单让用户选择.

(2)后端实现

分页对象:由于前端需要接收后端传来的数据信息,我们可以根据前端页面的分析,集成一个分页对象,便于我们进行数据传输

@Data
public class PageBean<T> {
    /**当前页*/
    private Integer pageNo;
    /**每页显示数*/
    private Integer pageSize;
    /**总页数*/
    private Integer totalPage;
    /**每页显示的数据集合*/
    private List<T> pageData;
}

Controller控制器代码:

首先,需要获取前端传来的pageNo,pageSize的参数
判断前端传来的数据是否合理
若前端未传递数据,使用设置的默认值
获取条件查询的数据
使用hashMap将pageNo,pageSize,条件查询的数据封装起来
调用业务层,查询所需数据
查到数据后,将数据放置数据域中
请求转发到前端页面

/**设置初始pageNo,pageSize*/
@WebServlet(urlPatterns = "/queryPage",
        initParams = {@WebInitParam(name="pageNo",value="1"),
        @WebInitParam(name="pageSize",value="3")}
)
public class PageController extends HttpServlet {
    @Override
    protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
        //获取页码,每页显示的记录数
        String pageNo = req.getParameter("pageNo");
        String pageSize = req.getParameter("pageSize");

        //验证数据合理性
        if(isNull(pageNo)){
            pageNo=this.getServletConfig().getInitParameter("pageNo");
        }
        if(isNull(pageSize)){
            pageSize=this.getServletConfig().getInitParameter("pageSize");
        }
        //获取条件查询的数据
        String empName = req.getParameter("empName");

        HashMap<String,Object> paramMap=new HashMap<>();
        paramMap.put("pageNo",pageNo);
        paramMap.put("pageSize",pageSize);
        paramMap.put("empName",empName);

        EmpService empService=new EmpServiceImp();
        //调用业务类的方法完成业务控制
        PageBean<Employee> pageBean=empService.page(paramMap);
        //将分页对象放入到请求域中
        req.setAttribute("beanPage",pageBean);

        req.setAttribute("empName",empName);

        //转发
        req.getRequestDispatcher("/list.jsp").forward(req,resp);
    }

    private boolean isNull(String pageNo) {
        if(pageNo==null||"".equals(pageNo)){
            return true;
        }
        return false;
    }
}

Service业务层代码:

pageNo(当前页)和pageSize(每页显示数)已经确定,
我们还需要的是totalPage(总页数)以及每页显示的数据集合,
总页数=总记录数/每页显示数,当不能整除时,总页数需要+1
并将其返回给controller也就是上面讲到的Controller流程的第六步。

 @Override
    public PageBean<Employee> page(HashMap<String, Object> paramMap) {
        //构建分页的Bean对象
        PageBean<Employee> pageBean = new PageBean<>();
        //获取当前页
        Integer pageNo=Integer.valueOf(paramMap.get("pageNo").toString());

        //封装每页显示的记录数
        pageBean.setPageSize(Integer.valueOf(paramMap.get("pageSize").toString()));
        
        //获取数据访问对象
        EmpDao empDao=SqlUtil.getMapper(EmpDao.class);

        //构建查询的参数
        HashMap<String,Object> conditionMap=new HashMap<>();
        //获取查询的条件
        conditionMap.put("empName",paramMap.get("empName"));
        
        //根据条件获取总记录数
        Integer count =empDao.selectCount(conditionMap);

        //计算总的页数
        //总页数=总记录数/每页显示条数
        //要通过%的方式判断是否能整除,不能整除要+1
        int totalPage=count%pageBean.getPageSize()==0?
                count/pageBean.getPageSize():count/pageBean.getPageSize()+1;
        
        if(pageNo<1){
            //如果传入的页码小于1,设置为第一页
            pageBean.setPageNo(1);
        }else if(pageNo>totalPage){
            //如果传入的页码大于总页数,设置为最后一页
            pageBean.setPageNo(totalPage);
        }else{
            //设置传入的页码数
            pageBean.setPageNo(pageNo);
        }

        //将总页数封装到pageBean上
        pageBean.setTotalPage(totalPage);
        
        //将查询的起始页码和每页显示数封装
        conditionMap.put("start",(pageBean.getPageNo()-1)*pageBean.getPageSize());
        conditionMap.put("size",pageBean.getPageSize());

        //调用数据访问层获取当前页的数据集合
        List<Employee> employeeList = empDao.selectByPage(conditionMap);
        //将数据集合封装到pageBean上
        pageBean.setPageData(employeeList);
        //断开数据库连接,返回数据集
        SqlUtil.realse();
        return pageBean;
    }

dao层代码:


    /**查询表的总记录数*/
    Integer selectCount(HashMap<String,Object> conditionMap);

    /**分页查询*/
    List<Employee> selectByPage(HashMap<String,Object> conditionMap);

此处使用mybatis进行数据库的查询

<!--查询表的总记录数-->
    <select id="selectCount" resultType="java.lang.Integer" parameterType="hashmap">
      select count(*) from emp
      <where>
          <if test="name!=null">
            emp.name like "%"#{name}"%"
          </if>
      </where>
    </select>

    <!--查询每页的数据-->
    <select id="selectByPage" resultMap="resultEmp" parameterType="hashmap">
      select emp.*,dept.name  as deptName from emp
        left join dept
        on emp.deptId=dept.id
        <where>
            <if test="empName!=null">
                emp.name like "%"#{empName}"%"
            </if>
        </where>
        limit #{start},#{size}
    </select>

(3)前端实现:

前端使用jsp

使用表单控件将pageSize和pageNo,查询条件empName提交到控制器
点击上一页,将pageNo-1,获取每页显示数pageSize,以及查询条件,跳转至servlet,将请求交给分页查询控制器处理
点击下页也同理
使用循环遍历每一页,点击第n页,将获取第n也的pageNo,pageSize,以及查询条件提交请求,返回第n页的数据
每页显示条数,设置下拉菜单,点击每页显示条数后,将触发changeSize方法
changeSize方法获取当前每页显示数以及查询条件,提交请求并返回数据

数据显示代码:

   <%--条件查询表单--%>
    <form action="queryPage" method="get">
        <input type="hidden" name="method" value="queryPage"/>
        <input type="hidden" name="pageSize" value="${beanPage.pageSize}"/>
        <input type="hidden" name="pageNo" value="1" />
        <input type="text" name="empName" placeholder="请输入员工姓名关键词" value="${empName}"/>
        <input type="submit" value="搜索"/>
    </form>
    <table cellpadding="0" cellspacing="0" border="1">
        <tr>
            <th>雇员编号</th>
            <th>雇员名字</th>
            <th>雇员工资</th>
            <th>雇员部门</th>
            <th>删除操作</th>
            <th>修改操作</th>
        </tr>
        <%--数据域中没有数据--%>
        <c:if test="${empty beanPage.pageData}">
            <tr>
                <td colspan="6">列表中没有数据,请添加数据后进行查看</td>
            </tr>
        </c:if>
        <%--数据域中数据不为空--%>
        <c:if test="${not empty beanPage.pageData}">
            <%--遍历获取数据--%>
            <c:forEach items="${beanPage.pageData}" var="e">
                <tr>
                    <td>${e.id}</td>
                    <td>${e.name}</td>
                    <td>${e.salary}</td>
                    <td>${e.dept.name}</td>
                    <td><a href="javascript:;" onclick="delBtn(${e.id})">删除</a></td>
                    <td><a href="javascript:;" onclick="updateBtn(${e.id})">修改</a></td>
                </tr>
            </c:forEach>
        </c:if>
    </table>

分页代码

 <a href="${pageContext.request.contextPath}/queryPage?pageNo=${beanPage.pageNo+1}&pageSize=${beanPage.pageSize}&empName=${empName}">上一页</a>
    <%--循环总页数,显示每一页--%>
    <c:forEach begin="1" end="${beanPage.totalPage}" varStatus="statue">
        <a href="${pageContext.request.contextPath}/queryPage?pageNo=${statue.count}"&pageSize="${beanPage.pageSize}&empName=${empName}" class="menuUI"
                <c:if test="${statue.count==beanPage.pageNo}">style="background-color: white"</c:if>>
        ${statue.count}</a>

    </c:forEach>
    <a href="${pageContext.request.contextPath}/queryPage?pageNo=${beanPage.pageNo+1}&pageSize=${beanPage.pageSize}&empName=${empName}">下一页</a>
    每页显示
    <select onchange="changeSize(this)">
        <option value="1" <c:if test="${beanPage.pageSize == 1}">selected</c:if>>1</option>
        <option value="2" <c:if test="${beanPage.pageSize == 2}">selected</c:if>>2</option>
        <option value="3" <c:if test="${beanPage.pageSize == 3}">selected</c:if>>3</option>
    </select>
    条

 function changeSize(obj){
        window.location.href="http://localhost:8080<%=request.getContextPath()%>/queryPage?pageNo=${beanPage.pageNo}&empName=${empName}&pageSize="+obj.value
    }