尚硅谷书城项目第五阶段-----图书模块(2)

144 阅读2分钟

1、编写Web层,与前端进行联调

图书列表管理页面流程示意图: 在这里插入图片描述

修改pages/manager/manager.jsp页面中 [图书管理] 的请求地址 在这里插入图片描述

BookServlet程序中的list方法

/**
     * 列表查询(查询全部图书)
     *
     * @param request
     * @param response
     * @throws ServletException
     * @throws IOException
     */
    protected void list(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
//        1 . 获取请求的参数 ( 如果有 )
//        2 . 调用BookService.queryBooks()查询全部图书
        List<Book> books = bookService.queryBooks();
//        3 . 把图书信息到Request域中
        request.setAttribute("books", books);
//        4 . 请求转发到
//                /pages/manager/book_manager.jsp页面
        request.getRequestDispatcher("/pages/manager/book_manager.jsp").forward(request,response);
    }

修改pages/manager/book_manager.jsp页面

注: 需要在页面顶端导入jstl标签库的核心jar包

<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>图书管理</title>
  <%--静态包含 公共的base标签,css样式,jquery文件  --%>
   <%@include file="/pages/common/header.jsp"%>
</head>
<body> 
   <div id="header">
         <img class="logo_img" alt="" src="../../static/img/logo.gif" >
         <span class="wel_word">图书管理系统</span>
      <%-- 静态包含后面管理模块的菜单 --%>
      <%@ include file="/pages/common/manager_menu.jsp"%>
   </div>
   
   <div id="main">
      <table>
         <tr>
            <td>名称</td>
            <td>价格</td>
            <td>作者</td>
            <td>销量</td>
            <td>库存</td>
            <td colspan="2">操作</td>
         </tr>

         <c:forEach items="${ requestScope.books }" var="book">
            <tr>
               <td>${ book.name }</td>
               <td>${ book.price }</td>
               <td>${ book.author }</td>
               <td>${ book.sales }</td>
               <td>${ book.stock }</td>
               <td><a href="book_edit.jsp">修改</a></td>
               <td><a href="#">删除</a></td>
            </tr>
         </c:forEach>
         
         <tr>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td><a href="book_edit.jsp">添加图书</a></td>
         </tr>  
      </table>
   </div>
   
   <div id="bottom">
      <span>
         尚硅谷书城.Copyright &copy;2015
      </span>
   </div>
</body>
</html>

表单重复提交问题 浏览器会记录页面上最后一次的请求.只要用户按下功能键F5 ,就会发起最后一次请求给服务器.就会造成表单重复提交

2、添加图书功能的实现

添加图书功能的流程示意图: 在这里插入图片描述

先修改pages/manager/book_manger.jsp页面中[添加图书]的请求地址 在这里插入图片描述

修改pages/manager/book_edit.jsp页面

<form action="manager/bookServlet" method="get">
   <input type="hidden" name="action" value="add">
   <table>
      <tr>
         <td>名称</td>
         <td>价格</td>
         <td>作者</td>
         <td>销量</td>
         <td>库存</td>
         <td colspan="2">操作</td>
      </tr>     
      <tr>
         <td><input name="name" type="text" value="时间简史"/></td>
         <td><input name="price" type="text" value="30.00"/></td>
         <td><input name="author" type="text" value="霍金"/></td>
         <td><input name="sales" type="text" value="200"/></td>
         <td><input name="stock" type="text" value="300"/></td>
         <td><input type="submit" value="提交"/></td>
      </tr>  
   </table>
</form>

BookServlet程序中的add方法:

/**
     * 添加图书
     *
     * @param request
     * @param response
     * @throws ServletException
     * @throws IOException
     */
    protected void add(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        // 1 获取请求的参数,封装为Book对象
        Book book = WebUtils.copyParamToBean(new Book(), request.getParameterMap());
        //2 调用 BookService.addBook(Book)添加图书
        bookService.addBook(book)  ;
//        // 3 查询全部图书,保存到reqeust域中
//        request.setAttribute("books", bookService.queryBooks());
//        // 4 请求转发到/pages/manager/book_manager.jsp页面
//        request.getRequestDispatcher("/pages/manager/book_manager.jsp").forward(request,response)   ;

        response.sendRedirect(request.getContextPath()
                + "/manager/bookServlet?action=list");

    }

3、删除图书功能的实现示意图:

在这里插入图片描述

修改book_manager.jsp页面中[删除]的地址 : 在这里插入图片描述

BookServlet程序中delete方法

/**
 * 删除图书
 *
 * @param request
 * @param response
 * @throws ServletException
 * @throws IOException
 */
protected void delete(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
    //1 获取请求的参数 id
    int id = WebUtils.parseInt(request.getParameter("id"), 0);
    //2 调用bookService.deleteBookById(id) 删除图书
    bookService.deleteBookById(id);
    // 3 重定向回图书列表管理页面
    response.sendRedirect(request
            .getContextPath() + "/manager/bookServlet?action=list");
}

给删除添加确认提示操作代码:

<script type="text/javascript">
   $(function () {
      // 根据a标签和它的样式,查找绑定单击事件
      $("a.deleteBook").click(function () {
         var text = $(this).parent().parent().find("td:first").text();
         // confirm是javaScript语言提供的一个确认提示框操作函数
         // 它的参数是提示框的提示内容
         // 它有两个按钮,一个确定,一个取消
         // 当用户点击确定,返回true,
         // 当用户点击取消,返回false
         return confirm('你确定要删除 ' + text +  ' 吗?');

      });
   });
</script>

8、修改图书功能的实现:

修改图书流程示意图: 在这里插入图片描述

修改book_manager.jsp页面 [修改] 的请求地址 在这里插入图片描述

**BookServlet程序中getBook方法**
protected void getBook(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
    // 1 获取请求的参数图书信息
    int id = WebUtils.parseInt(request.getParameter("id"), 0);
    //2 调用 bookService.queryBookById(id):Book图书信息;
    Book book = bookService.queryBookById(id);
    // 3 保存图书信息到Request域中
    request.setAttribute("book",book);
    // 4 请求转发到book_edit.jsp页面
    request.getRequestDispatcher("/pages/manager/book_edit.jsp")
            .forward(request,response);
}

在book_edit.jsp页面中回显要修改的数据:

<form action="manager/bookServlet" method="get">
   <input type="hidden" name="action" value="${ empty param.id ? "add" : "update" }">
   <input type="hidden" name="id" value="${requestScope.book.id}">
   <table>
      <tr>
         <td>名称</td>
         <td>价格</td>
         <td>作者</td>
         <td>销量</td>
         <td>库存</td>
         <td colspan="2">操作</td>
      </tr>     
      <tr>
         <td><input name="name" type="text" value="${requestScope.book.name}"/></td>
         <td><input name="price" type="text" value="${requestScope.book.price}"/></td>
         <td><input name="author" type="text" value="${requestScope.book.author}"/></td>
         <td><input name="sales" type="text" value="${requestScope.book.sales}"/></td>
         <td><input name="stock" type="text" value="${requestScope.book.stock}"/></td>
         <td><input type="submit" value="提交"/></td>
      </tr>  
   </table>
</form>

解决book_edit.jsp页面即要添加.又要修改的问题.

<input type="hidden" name="action" value="${ empty param.id ? "add" : "update" }">
   <input type="hidden" name="id" value="${requestScope.book.id}">
   <table>
      <tr>
         <td>名称</td>
         <td>价格</td>
         <td>作者</td>
         <td>销量</td>
         <td>库存</td>
         <td colspan="2">操作</td>
      </tr>     
      <tr>
         <td><input name="name" type="text" value="${requestScope.book.name}"/></td>
         <td><input name="price" type="text" value="${requestScope.book.price}"/></td>
         <td><input name="author" type="text" value="${requestScope.book.author}"/></td>
         <td><input name="sales" type="text" value="${requestScope.book.sales}"/></td>
         <td><input name="stock" type="text" value="${requestScope.book.stock}"/></td>
         <td><input type="submit" value="提交"/></td>
      </tr>  
   </table>
</form>

BookServlet程序中update方法

/**
 * 更新图书
 *
 * @param request
 * @param response
 * @throws ServletException
 * @throws IOException
 */
protected void update(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
    // 获取请求的全部参数.封装为book对象
    Book book = WebUtils.copyParamToBean(new Book(), request.getParameterMap());
    // 调用 bookService.updateBookById(book);
    bookService.updateBookById(book);
    // 重定向到图书列表管理页面
    response.sendRedirect(request.getContextPath()
            + "/manager/bookServlet?action=list");
}