# 步驟1:頁面效果 首先訪問 http://127.0.0.1:8080/tmall_j2ee/admin\_category\_list 觀看頁面效果 注： 剛開始看不到分類數據，分類數據需要自己添加  # 步驟 2 : MVC 設計思想 根據**MVC設計模式**的思想，做J2EE web應用，從MVC的角度來看，就是把不同的數據顯示在不同的頁面上。 數據就是**模型**( bean, dao ) 頁面就是**視圖**( jsp ) 控制不同的模型顯示在不同的視圖上，這件事，就是由**控制器**來完成 ( servlet ) 所以分類管理，從MVC的角度來看，就是把多條分類Category數據放在一個集合里， 讓listCategory.jsp 這個視圖去顯示出來。  # 步驟 3 : list()方法 根據**filter+servlet的設計模式**，訪問地址 http://127.0.0.1:8080/tmall_j2ee/admin\_category\_list 會導致CategoryServlet的list方法被調用。 根據**MVC 設計思想**，CategoryServlet充當的是C-控制器的角色 那么在list()方法里做的事情是，取出數據，并且交由jsp顯示。 第二行： 通過categoryDAO取得數據集合 cs 第六行： 通過request.setAttribute 放在 “thecs" 這個key中，為后續服務端跳轉到jsp之后使用。 第九行：return "admin/listCategory.jsp"; 服務端跳轉到視圖listCategory.jsp頁面。 注：CategoryServlet的list()方法中可以直接使用categoryDao ，是因為其父類BaseBackServlet在屬性中聲明了 ``` public CategoryDao categoryDao = new CategoryDaoImpl(); ``` 作為BaseBackServlet的子類，CategoryServlet可以直接使用該public修飾的屬性 ``` public String list(HttpServletRequest request, HttpServletResponse response) { List<Category> cs = categoryDao.list(); request.setAttribute("thecs", cs); return "admin/listCategory.jsp"; } ``` > 分頁功能在后面添加。 # 步驟 4 : 服務端跳轉 list()方法返回字符串 "admin/listCategory.jsp" 就導致服務端跳轉到了頁面 "admin/listCategory.jsp"。 為什么返回這個字符串，就可以實現**服務端跳轉**呢？ 在servlet中進行服務端跳轉不是要如下代碼格式嗎？ ``` request.getRequestDispatcher("xxx.jsp").forward(request, response); ``` 這個就要結合CategoryServlet的父類BaseBackServlet來理解了。 在BaseBackServlet，在借助反射機制調用了list()方法之后，獲取返回值redirect，然后根據返回值進行處理： * 如果redirect是以@開頭的字符串，那么就進行客戶端跳轉 * 如果redirect是以%開頭的字符串，那么就直接輸出字符串 * 如果都不是，則進行服務端跳轉 ``` package com.dodoke.controller; import java.lang.reflect.Method; import javax.servlet.annotation.WebServlet; import javax.servlet.http.HttpServlet; import javax.servlet.http.HttpServletRequest; import javax.servlet.http.HttpServletResponse; import com.dodoke.dao.impl.CategoryDaoImpl; import com.dodoke.dao.inter.CategoryDao; /** * Servlet implementation class BaseBackServlet */ @WebServlet("/BaseBackServlet") public abstract class BaseBackServlet extends HttpServlet { private static final long serialVersionUID = 1L; public abstract String add(HttpServletRequest request, HttpServletResponse response); public abstract String delete(HttpServletRequest request, HttpServletResponse response); public abstract String edit(HttpServletRequest request, HttpServletResponse response); public abstract String update(HttpServletRequest request, HttpServletResponse response); public abstract String list(HttpServletRequest request, HttpServletResponse response); public CategoryDao categoryDao = new CategoryDaoImpl(); public void service(HttpServletRequest request, HttpServletResponse response) { try { /* 借助反射，調用對應的方法 */ String method = (String) request.getAttribute("method"); Method m = this.getClass().getMethod(method, javax.servlet.http.HttpServletRequest.class, javax.servlet.http.HttpServletResponse.class); String redirect = m.invoke(this, request, response).toString(); /* 根據方法的返回值，進行相應的客戶端跳轉，服務端跳轉，或者僅僅是輸出字符串 */ System.out.println(redirect); if (redirect.startsWith("@")) { response.sendRedirect(redirect.substring(1)); } else if (redirect.startsWith("%")) { response.getWriter().print(redirect.substring(1)); } else { request.getRequestDispatcher(redirect).forward(request, response); } } catch (Exception e) { e.printStackTrace(); throw new RuntimeException(e); } } } ``` # 步驟5:listCategory.jsp 最后就是視圖listCategory.jsp了。 在**JSP包含關系**中已經講解過了listCategory.jsp中包含的jsp文件，這里就不做贅述。 本步驟就關注在listCategory.jsp主體內容是如何工作的。 作為視圖，擔當的角色是顯示數據。所以關鍵就是從第44行開始，借助JSTL的c:forEach標簽遍歷從CategoryServlet的list() 的request.setAttribute("thecs", cs); 傳遞過來的集合。 ``` <c:forEach items="${thecs}" var="c"> ``` ``` <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" import="java.util.*"%> <%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%> <%@include file="../include/admin/adminHeader.jsp"%> <%@include file="../include/admin/adminNavigator.jsp"%> <script> $(function(){ $("#addForm").submit(function(){ if(!checkEmpty("name","分類名稱")) return false; if(!checkEmpty("categoryPic","分類圖片")) return false; return true; }); }); </script> <title>分類管理</title> <div class="workingArea"> <h1 class="label label-info" >分類管理</h1> <br> <br> <div class="listDataTableDiv"> <table class="table table-striped table-bordered table-hover table-condensed"> <thead> <tr class="success"> <th>ID</th> <th>圖片</th> <th>分類名稱</th> <!-- <th>屬性管理</th> --> <!-- <th>產品管理</th> --> <th>編輯</th> <th>刪除</th> </tr> </thead> <tbody> <c:forEach items="${thecs}" var="c"> <tr> <td>${c.id}</td> <td><img height="40px" src="img/category/${c.id}.jpg"></td> <td>${c.name}</td> <%-- <td><a href="admin_property_list?cid=${c.id}"><span class="glyphicon glyphicon-th-list"></span></a></td> --%> <%-- <td><a href="admin_product_list?cid=${c.id}"><span class="glyphicon glyphicon-shopping-cart"></span></a></td> --%> <td><a href="admin_category_edit?id=${c.id}"><span class="glyphicon glyphicon-edit"></span></a></td> <td><a deleteLink="true" href="admin_category_delete?id=${c.id}"><span class=" glyphicon glyphicon-trash"></span></a></td> </tr> </c:forEach> </tbody> </table> </div> <%-- <div class="pageDiv"> <%@include file="../include/admin/adminPage.jsp" %> </div> --%> <div class="panel panel-warning addDiv"> <div class="panel-heading">新增分類</div> <div class="panel-body"> <form method="post" id="addForm" action="admin_category_add" enctype="multipart/form-data"> <table class="addTable"> <tr> <td>分類名稱</td> <td><input id="name" name="name" type="text" class="form-control"></td> </tr> <tr> <td>分類圖片</td> <td> <input id="categoryPic" accept="image/*" type="file" name="filepath" /> </td> </tr> <tr class="submitTR"> <td colspan="2" align="center"> <button type="submit" class="btn btn-success">提 交</button> </td> </tr> </table> </form> </div> </div> </div> <%@include file="../include/admin/adminFooter.jsp"%> ```