基于分页实现数据的增删查改

奋斗着，享受着

于 2023-05-16 17:02:53 发布

阅读量655

点赞数

分类专栏： jsp、servlet 文章标签： servlet java 前端

本文链接：https://blog.csdn.net/vgfvgf/article/details/130705985

版权

jsp、servlet 专栏收录该内容

6 篇文章 0 订阅

订阅专栏

一：主要思路

1:分页功能:

新建一个实体类，用来存储每页数据，数据量，页码，页数，下一页，上一页的相关信息。

@Data
public class PageModel<T> {
    //本页数据
    private List<T> pageData;
    //最大数量
    private  Integer pageSize=2;
    //第几页
    private  Integer pageNo;
    //总记录数
    private  Integer count;
   //获取总页数
    public  Integer getAllPage(){
        return  count%pageSize==0?count/pageSize:count/pageSize+1;
    }
    //判断是否有下一页
    public Integer getNextPage(){
        if(pageNo<getAllPage()){
            return  pageNo+1;
        }else{
            return  getAllPage();
        }
    }
    //判断是否有上一页
    public Integer getPreviousePage(){
        if(pageNo>1){
            return  pageNo-1;
        }else{
            return  1;
        }

    }

分页展示代码:

<html>
<head>
    <title>分页展示</title>
    <link type="text/css" rel="stylesheet" href="bootstrap/css/bootstrap.css">
    <script type="text/javascript" src="${pageContext.request.contextPath}/js/jquery-1.12.4.js" ></script>
<%--    <link href="bootstrap/static/bootstrap-3.3.7-dist/css/bootstrap.css" rel="stylesheet" />--%>
<%--    <script type="text/javascript" src="js/jquery-1.12.4.js" ></script>--%>
    <script type="text/javascript" src="bootstrap/static/bootstrap-3.3.7-dist/js/npm.js" ></script>
    <script>
       function add(){
           window.location.href="preadd.do?method=preadd";
       }
       function subForm(pageno){
           // alert(pageno)
           $("[name='pageNo']").val(pageno)//给name='pageNo'的元素赋值
           $("[title='queryForm']").submit();//提交表单
           // document.getElementById("form").submit();
       }
    </script>
    <style>
          #container{
              padding: 10px;
          }
          #content{
              text-align: center;
          }
          #page{

          }
          #query{
              float: left;
              text-align: center;
              margin: 10px;
              padding: 10px;
          }
          form{
              display: flex;
          }
    </style>
</head>
<body>
<div id="query">
    <div>
        <form method="post" action="student.do?method=select" title="queryForm" name="myform">
            <input type="hidden" name="pageNo" id="pageNo"/>
            学生姓名：<input  type="text" name="stuname" value="${param.stuname}"/>
            学生住址：<input  type="text" name="stuadd" value="${param.stuadd}"/>
            性别：<input  type="text" name="stusex" value="${param.stusex}"/>
            年级:<select name="gradename">
            <option value="">请选择</option>
            <c:forEach items="${GAll}" var="grade">
                <option value="${grade.gradename}"  ${param.gradename==grade.gradename?"selected='true'":""}>${grade.gradeid}--${grade.gradename}</option>
            </c:forEach>
        </select>
            <input type="submit" value="查询">
        </form>
    </div>
</div>

<div id="container">
      <div style="text-align: right;margin: 10px">
          <button type="button" class="btn btn-primary" id="add" onclick="add();" >添加</button>
      </div>


      <div id="content">
          <table class="table">
              <tr>
                  <td>学生编号</td>
                  <td>登录密码</td>
                  <td>学生姓名</td>
                  <td>性别</td>
                  <td>年级</td>
                  <td>电话</td>
                  <td>地址</td>
                  <td>生日</td>
                  <td>邮箱</td>
                  <td>操作</td>
              </tr>
              <c:forEach items="${list}" var="student">
                  <tr>
                      <td>${student.studentno}</td>
                      <td>${student.loginpwd}</td>
                      <td>${student.studentname}</td>
                      <td>${student.sex}</td>
                      <td>${student.gradeid}</td>
                      <td>${student.phone}</td>
                      <td>${student.address}</td>
                      <td>${student.borndate}</td>
                      <td>${student.email}</td>
                      <td>
                          <a href="student.do?method=preupdate&studentNo=${student.studentno}"/>修改
                          <a href="student.do?method=delete&studentNo=${student.studentno}"/>删除
                      </td>
                  </tr>
              </c:forEach>
          </table>
      </div>
      <div id="page">
          <div style="float: left">
              <nav aria-label="...">
                  <ul class="pager">
                      <li><a href="javascript:void(0)" onclick="subForm(1)">首页</a></li>
                      <li><a href="javascript:void(0)" onclick="subForm(${pageModel.previousePage})">上一页</a></li>
                      <li><a href="javascript:void(0)" onclick="subForm(${pageModel.nextPage})">下一页</a></li>
                      <li><a href="javascript:void(0)" onclick="subForm(${pageModel.allPage})">尾页</a></li>
                  </ul>
              </nav>
          </div>
          <div style="float: right;font-size: 12px;margin-top: 25px">
              共${pageModel.count}条记录    当前第${pageModel.pageNo}页  一共${pageModel.allPage}页   每页展示${pageModel.pageSize}条数据
          </div>
      </div>

</div>
</body>
</html>

在dao层学生类中新建两个方法，一个用来获取总记录数，一个用来获取本页数据（使用limit实现），再通过service层调用方法。

  @Override
    public int getCount() {
        int count = Integer.parseInt( new JDBCUtils().queryOneVal("select count(1) from student").toString());
        return count;
    }

    @Override
    public List<Student> getPageData(int pageNo, int pageSize) {
        return new JDBCUtils().executeQuery(Student.class,"select * from student limit ?,?",(pageNo-1)*pageSize,pageSize);
    }

servlet层有个list方法，页码初始值为1，随着获取页面传的页码改变，然后调用service层获取该页数据信息，传递到页面进行展示。

    public void list(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
        int pageNo = 1;//页码初始值为1
        if(null != req.getParameter("pageNO")){
            pageNo = Integer.parseInt(req.getParameter("pageNO"));//获取页面传来的页码改变
        }
        PageModel<Student> pageModel = new StudentService().getpageModel(pageNo);
        List<Student> list = pageModel.getPageData();//获取页面数据
        List<Grade> getall = new GradeService().getall();//获取年级信息
        req.setAttribute("GAll",getall);
        req.setAttribute("list",list);
        req.setAttribute("pageModel",pageModel);
        req.getRequestDispatcher("pageList.jsp").forward(req,resp);
    }

2：数据添加

点击添加按钮，转入后端servlet代码的preadd方法中，查询出年级信息并传到前端页面通过下拉列表展示，然后填写信息，点击提交，

    public void preadd(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
        GradeService gradeService = new GradeService();
        List<Grade> all = gradeService.getall();
//        System.out.println(all);
        req.setAttribute("list",all);
        req.getRequestDispatcher("addStu.jsp").forward(req,resp);
    }

添加页面代码

<html>
<head>
  <title>Title</title>
  <script type="javascript" src="js/jquery-1.12.4.js"></script>
  <link type="text/css" rel="stylesheet" href="bootstrap/css/bootstrap.css">
  <script>
    function  checkTypeid(){
      var v =  document.getElementsByName("booktype")[0].value;
      if(v=="-1"){
        alert("图书类标必须选择");
        return false;
      }
      return true;
    }
  </script>
</head>
<body>
<h1>学生添加</h1>
<form method="post" action="student.do?method=add" onsubmit="return checkForm();">
  <div class="form-group">
    <label for="stuno">学生学号</label>
    <input type="text" class="form-control" id="stuno" placeholder="stuno" name="stuno">
  </div>
  <div class="form-group">
    <label for="stuname">学生姓名</label>
    <input type="text" class="form-control" id="stuname" placeholder="stuname" name="stuname">
  </div>
  <div class="form-group">
    <label for="stupassword">登陆密码</label>
    <input type="text" class="form-control" id="stupassword" placeholder="stupassword" name="stupassword" onblur="checkBookNum()">
    <span class="error"></span>
  </div>
  <div class="form-group">
    <label for="stusex">学生性别</label>
    <input type="text" class="form-control" id="stusex" placeholder="stusex" name="stusex">
  </div>
  <div class="form-group">
    <label for="stuphone">学生电话</label>
    <input type="text" class="form-control" id="stuphone" placeholder="stuphone" name="stuphone">

  </div>
  <div class="form-group">
    <label for="stuaddress">学生住址</label>
    <input type="text" class="form-control" id="stuaddress" name="stuaddress">
  </div>
  <div class="form-group">
    <label for="stuborn">学生生日</label>
    <input type="date" class="form-control" id="stuborn" name="stuborn">
  </div>
  <div class="form-group">
    <label for="stuemail">学生邮件</label>
    <input type="text" class="form-control" id="stuemail" name="stuemail">
  </div>
  <div class="form-group">
    <label for="stuname">学生年级</label>
    <select class="form-control" name="stugradeid" onchange="checkBookNum()">
      <option value="-1">请选择</option>
      <c:forEach items="${list}" var="grade">
        <option value="${grade.gradeid}">${grade.gradeid}--${grade.gradename}</option>
      </c:forEach>
    </select>
  </div>
  <button type="submit" class="btn btn-default">保存</button>
</form>
</body>
</html>

页面提交表单，调用servlet层的add方法，该方法获取到所有参数信息，生成一个学生对象，然后调用dao层的添加方法添加学生信息，并调用list方法转到分页展示页面。

public void add(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        //获取参数
//        System.out.println(request.getParameter("StudentNo"));
        StudentDao studentDao = new StudentDao();
        String studentNo = request.getParameter("stuno");
        String loginPwd = request.getParameter("stupassword");
        String studentName = request.getParameter("stuname");
        String sex = request.getParameter("stusex");
        String gradeId = request.getParameter("stugradeid");
        String phone = request.getParameter("stuphone");
        String address = request.getParameter("stuaddress");
        String bornDate = request.getParameter("stuborn");
        String email = request.getParameter("stuemail");
        Student student = new Student(studentNo,loginPwd,studentName,sex,Integer.parseInt(gradeId),phone,address,bornDate,email);
        //插入数据
        studentDao.save(student);
//        System.out.println(update);
        //响应页面
        response.sendRedirect("student.do?method=list");
    }

3：数据删除

点击页面学生信息后面的删除，调用servlet层的delete方法并将学生学号传递过来，delete方法调用service层的delete方法通过学号删除该学生信息，并重新调用list方法转到数据分页展示页面。

    public void delete(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
        String studentNo = req.getParameter("studentNo");
        StudentService service  = new StudentService();
        service.delete(studentNo);
        resp.sendRedirect("student.do?method=list");
    }

4：数据修改

点击页面学生信息后的修改，将学生学号传递过来调用servlet层的preupdate方法，preupdate方法通过学号查询出该学生相关信息，并通过GradeService查询出所有的年级信息，传输该数据到数据修改页面，默认值为修改前的值。然后用户修改完后调用service层的update方法通过学号修改该学生信息，并重新调用list方法转到数据分页展示页面。

public void preupdate(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        //获取参数
        String studentNo = request.getParameter("studentNo");
//        System.out.println(studentNo);
        StudentService studentService = new StudentService();
        Student student = studentService.selectOne(studentNo);
        GradeService gradeService = new GradeService();
        List<Grade> getall = gradeService.getall();
//        System.out.println(getall);
//        request.setAttribute("gradename",gradename);
        request.setAttribute("GAll",getall);
        request.setAttribute("student",student);
//        System.out.println(student);
        //响应页面
        request.getRequestDispatcher("update.jsp").forward(request,response);
    }

 public void update(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        //获取参数
        Student student = new Student();
        student.setStudentno(request.getParameter("stuno"));
        student.setStudentname(request.getParameter("stuname"));
        student.setLoginpwd(request.getParameter("stupassword"));
        student.setSex(request.getParameter("stusex"));
        student.setPhone(request.getParameter("stuphone"));
        student.setAddress(request.getParameter("stuaddress"));
        student.setBorndate(request.getParameter("stuborn"));
        student.setEmail(request.getParameter("stuemail"));
        student.setGradename(request.getParameter("gradename"));
        String name = request.getParameter("gradename");
        Grade grade = new GradeService().findOneByName(name);
        student.setGradeid(grade.getGradeid());
        System.out.println(student);
        StudentService studentService = new StudentService();
         studentService.update(student);
        //响应页面
        response.sendRedirect("student.do?method=list");
    }

修改页面代码：

<html>
<head>
    <title>更新</title>
</head>
<body>
<h1>信息修改</h1>
<form method="post" action="student.do?method=update">
    <div class="form-group">
        <label for="stuno">学生学号</label>
        <input type="text" class="form-control" id="stuno" value="${student.studentno}" name="stuno">
    </div>
    <div class="form-group">
        <label for="stuname">学生姓名</label>
        <input type="text" class="form-control" id="stuname" value="${student.studentname}" name="stuname">
    </div>
    <div class="form-group">
        <label for="stupassword">登陆密码</label>
        <input type="text" class="form-control" id="stupassword" value="${student.loginpwd}"  name="stupassword" onblur="checkBookNum()">
        <span class="error"></span>
    </div>
    <div class="form-group">
        <label for="stusex">学生性别</label>
        <input type="text" class="form-control" id="stusex" value="${student.sex}"  name="stusex">
    </div>
    <div class="form-group">
        <label for="stuphone">学生电话</label>
        <input type="text" class="form-control" id="stuphone" value="${student.phone}"  name="stuphone">

    </div>
    <div class="form-group">
        <label for="stuaddress">学生住址</label>
        <input type="text" class="form-control" id="stuaddress" value="${student.address}" name="stuaddress">
    </div>
    <div class="form-group">
        <label for="stuborn">学生生日</label>
        <input type="date" class="form-control" id="stuborn" value="${student.borndate}" name="stuborn">
    </div>
    <div class="form-group">
        <label for="stuemail">学生邮件</label>
        <input type="text" class="form-control" id="stuemail" value="${student.email}" name="stuemail">
    </div>
    <div class="form-group">
        <label for="gradename">学生年级</label>
        <select class="form-control" id="gradename" name="gradename">
            <option value="">请选择</option>
            <c:forEach items="${GAll}" var="grade">
                <option value="${grade.gradename}" ${student.gradename==grade.gradename?"selected='true'":""}>${grade.gradeid}--${grade.gradename}</option>
            </c:forEach>
        </select>
    </div>
    <button type="submit" class="btn btn-default">保存</button>
</form>
</body>
</html>

数据查询（条件查询）：

通过输入查询条件然后点击查询后服务端执行servlet层的select方法,该方法调用service层的getall、getpagedata方法来获取符合条件的记录数及相关数据，保存并发送到页面。后续点击切换页码也执行该方法查询符合条件的数据并传输展示。

    //条件查询
//获取符合条件的总记录数
    @Override
    public int getCount(stuCondition stuCondition) {
        StringBuilder stringBuilder = new StringBuilder("select count(1) from student s left join grade g on s.GradeId = g.GradeId where 1 = 1");
        List<Object> list = new ArrayList<>();
        appendCons(stringBuilder,list,stuCondition);
        Object o = new JDBCUtils().queryOneVal(stringBuilder.toString(), list.toArray());
        return Integer.parseInt(o.toString());

    }
//根据页码获取本页数据
    @Override
    public List<Student> getPageData(stuCondition stuCondition, int pageNo, int pageSize) {
        StringBuilder stringBuilder = new StringBuilder("select s.*,g.GradeName from student s left join grade g on s.GradeId = g.GradeId where 1 = 1");
        List<Object> list = new ArrayList<>();
        appendCons(stringBuilder,list,stuCondition);
        stringBuilder.append(" limit ?,?");
        list.add((pageNo-1)*pageSize);
        list.add(pageSize);
//        System.out.println(stringBuilder);
        return new JDBCUtils().executeQuery(Student.class,stringBuilder.toString(),list.toArray());
    }
//辅助方法（条件拼接）
    public void appendCons(StringBuilder stringBuilder,List<Object> params,stuCondition stuCondition){
        if(StringUtils.Stringjudge(stuCondition.stuname)){
            stringBuilder.append(" and StudentName like ?");
            params.add("%"+stuCondition.stuname+"%");
        }
        if(StringUtils.Stringjudge(stuCondition.stuadd)){
            stringBuilder.append(" and Address = ?");
            params.add(stuCondition.stuadd);
        }
        if(StringUtils.Stringjudge(stuCondition.stusex)){
            stringBuilder.append(" and Sex = ?");
            params.add(stuCondition.stusex);
        }
        if(StringUtils.Stringjudge(stuCondition.gradeName)){
            stringBuilder.append(" and GradeName = ?");
            params.add(stuCondition.gradeName);
        }
    }

    public void select(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException{
//        System.out.println("select方法进入！");
        stuCondition condition = new stuCondition();
//        System.out.println(req.getParameter("stuname"));
        condition.setStuname(req.getParameter("stuname"));
        condition.setStuadd( req.getParameter("stuadd"));
        condition.setStusex(req.getParameter("stusex"));
        condition.setGradeName(req.getParameter("gradename"));
        System.out.println(req.getParameter("gradename"));
        System.out.println(condition);
        int pageNo=1;
        String pageNoStr = req.getParameter("pageNo");
        if(StringUtils.Stringjudge(pageNoStr)){
            pageNo = Integer.parseInt(pageNoStr);
        }
        System.out.println("当前页码"+pageNo);
        PageModel<Student> pageModel = new StudentService().getPageModel(condition,pageNo);
//        System.out.println(pageModel);
        List<Student> list = pageModel.getPageData();
        List<Grade> getall = new GradeService().getall();
        req.setAttribute("GAll",getall);
        req.setAttribute("list",list);
        req.setAttribute("pageModel",pageModel);
        req.getRequestDispatcher("pageList.jsp").forward(req,resp);
    }