「JavaWeb基礎」客戶關系管理系統(tǒng)(修訂版)（完整的客戶關系管理系統(tǒng)）

成果圖

我們完成的就是下面的項目！

「JavaWeb基礎」客戶關系管理系統(tǒng)(修訂版)（完整的客戶關系管理系統(tǒng)）

搭建配置環(huán)境

配置Tomcat
導入開發(fā)包
建立開發(fā)用到的程序包

「JavaWeb基礎」客戶關系管理系統(tǒng)(修訂版)（完整的客戶關系管理系統(tǒng)）

在數(shù)據(jù)庫創(chuàng)建相對應的表

「JavaWeb基礎」客戶關系管理系統(tǒng)(修訂版)（完整的客戶關系管理系統(tǒng)）

開發(fā)DAO

DAO應該提供增加客戶和查詢用戶的功能

增加用戶

「JavaWeb基礎」客戶關系管理系統(tǒng)(修訂版)（完整的客戶關系管理系統(tǒng)）

開發(fā)servic

提供UI，增加客戶的Servlet

//直接跳轉到顯示增加用戶頁面的JSP request.getRequestDispatcher(“/WEB-INF/addCustomer.jsp”).forward(request, response);

我們發(fā)現(xiàn)，在日期的下拉框中，只有一個數(shù)據(jù)（因為我們在value中只寫了一個數(shù)據(jù)）

要想在下拉框中可以選擇很多的數(shù)據(jù)，那么value的值就不能單單只有一個。當然了，也不可能在JSP頁面中寫下面的代碼

我們用javaScript生成下拉框的數(shù)據(jù)就行了??！

獲取年份！

「JavaWeb基礎」客戶關系管理系統(tǒng)(修訂版)（完整的客戶關系管理系統(tǒng)）

獲取月份和日也類似

「JavaWeb基礎」客戶關系管理系統(tǒng)(修訂版)（完整的客戶關系管理系統(tǒng)）

在JSP頁面中導入javascript文件
注意：javasrcipt文件不能放在WEB-INF下面?。。。》駝t是獲取不到的?。?！

這三個函數(shù)都是在頁面加載時就應該被初始化了，所以在body上綁定onload時間即可??！

function pageInit() { makeYear(); makeMonth(); makeDay(); } <body onload=”pageInit()”>

效果：

「JavaWeb基礎」客戶關系管理系統(tǒng)(修訂版)（完整的客戶關系管理系統(tǒng)）

開發(fā)處理表單數(shù)據(jù)的Servlet

將表單的數(shù)據(jù)封裝到Bean對象中，要開發(fā)工具類

「JavaWeb基礎」客戶關系管理系統(tǒng)(修訂版)（完整的客戶關系管理系統(tǒng)）

處理表單數(shù)據(jù)的Servlet代碼：

「JavaWeb基礎」客戶關系管理系統(tǒng)(修訂版)（完整的客戶關系管理系統(tǒng)）

效果：

「JavaWeb基礎」客戶關系管理系統(tǒng)(修訂版)（完整的客戶關系管理系統(tǒng)）

提供查詢客戶界面的Servlet

//跳轉到顯示客戶界面信息的jsp request.getRequestDispatcher(“/WEB-INF/lookCustomer.jsp”).forward(request, response);

查詢總記錄數(shù)

查詢總記錄數(shù)也就是查詢數(shù)據(jù)庫表的記錄有多少條，這是關于對數(shù)據(jù)庫數(shù)據(jù)的操作，所以肯定是在dao層做！

「JavaWeb基礎」客戶關系管理系統(tǒng)(修訂版)（完整的客戶關系管理系統(tǒng)）

查詢分頁的數(shù)據(jù)

獲取分頁的數(shù)據(jù)也是查詢數(shù)據(jù)庫的記錄，這也是關于對數(shù)據(jù)庫的操作，所以也是在Dao層做的！

「JavaWeb基礎」客戶關系管理系統(tǒng)(修訂版)（完整的客戶關系管理系統(tǒng)）

分析

現(xiàn)在我們已經可以知道總記錄數(shù)了，對于其他3個變量（每頁顯示記錄數(shù)【由程序員來指定】，當前是多少頁【由用戶來指定】，總頁數(shù)【由總記錄數(shù)和每頁顯示記錄數(shù)來算數(shù)來的】）

現(xiàn)在要分析的是，這些變量應該放在哪里呢？？？全部放在Dao層？？全部放在Dao層是可以實現(xiàn)功能的，但是，這樣MVC結構就被破壞掉了（Dao層只用來對數(shù)據(jù)進行CRUD操作，4個變量存在Dao層，是不合理的）

最好的做法是這樣的：創(chuàng)建一個實體Page，將分頁用到的信息全部封裝在Page中實現(xiàn)！Page就代表著分頁的數(shù)據(jù)這樣就非常符合面向對象的思想了！

將數(shù)據(jù)封裝到Page中并在頁面上顯示分頁的數(shù)據(jù)

①：創(chuàng)建Page類

「JavaWeb基礎」客戶關系管理系統(tǒng)(修訂版)（完整的客戶關系管理系統(tǒng)）

②：BusinessService應該提供獲取分頁數(shù)據(jù)的服務

「JavaWeb基礎」客戶關系管理系統(tǒng)(修訂版)（完整的客戶關系管理系統(tǒng)）

③：web層調用BusinessService層的功能，獲取得到Page對象

「JavaWeb基礎」客戶關系管理系統(tǒng)(修訂版)（完整的客戶關系管理系統(tǒng)）

④：在JSP頁面中，使用EL表達式獲取到Page對象，從而輸出數(shù)據(jù)

「JavaWeb基礎」客戶關系管理系統(tǒng)(修訂版)（完整的客戶關系管理系統(tǒng)）

⑤：在JSP頁面中顯示頁碼，同時把碼數(shù)綁定到超鏈接去！

「JavaWeb基礎」客戶關系管理系統(tǒng)(修訂版)（完整的客戶關系管理系統(tǒng)）

效果：

「JavaWeb基礎」客戶關系管理系統(tǒng)(修訂版)（完整的客戶關系管理系統(tǒng)）

讓分頁的功能更加完善

顯示當前頁數(shù)，總頁數(shù)，總記錄數(shù)

當前頁數(shù)是：[${page.currentPageCount}] 總頁數(shù)是：${page.totalPageCount} 總記錄數(shù)是：${page.totalRecord}

效果：

「JavaWeb基礎」客戶關系管理系統(tǒng)(修訂版)（完整的客戶關系管理系統(tǒng)）

跳轉到某頁上

頁面效果：

「JavaWeb基礎」客戶關系管理系統(tǒng)(修訂版)（完整的客戶關系管理系統(tǒng)）

我們現(xiàn)在要做的就是：怎么樣才能輸入框輸入內容，然后點擊跳轉按鈕，將輸入框的數(shù)據(jù)發(fā)送到Servlet上，然后實現(xiàn)跳轉到某頁上功能

明顯地，我們肯定要使用JavaScript代碼！

效果：

「JavaWeb基礎」客戶關系管理系統(tǒng)(修訂版)（完整的客戶關系管理系統(tǒng)）

記錄JSP頁面的開始頁和結束頁

為什么我們要記錄JSP頁面的開始頁和結束頁呢？經過上面層層地優(yōu)化，我們感覺不出有什么問題了。那是因為數(shù)據(jù)量太少！

我們試著多添加點記錄進數(shù)據(jù)庫，再回來看看！

「JavaWeb基礎」客戶關系管理系統(tǒng)(修訂版)（完整的客戶關系管理系統(tǒng)）

從上面的圖我們可以發(fā)現(xiàn)頁數(shù)有多少，JSP頁面就顯示多少！這明顯不合理的，如果有100頁也顯示100頁嗎？

我們做一個規(guī)定，一次只能顯示10頁的數(shù)據(jù)。那么顯示哪10頁呢？這又是一個問題了，如果我們在看第11頁的數(shù)據(jù)，應該顯示的是第7到第16頁的數(shù)據(jù)（顯示11附近的頁數(shù)），我們在看第2頁的數(shù)據(jù)，應該顯示第1到第10頁的數(shù)據(jù)。用戶想要看的頁數(shù)是不明確的，我們顯示附近的頁數(shù)也是不明確的！。我們應該把用戶想要看的頁數(shù)記錄下來，然后根據(jù)邏輯判斷，顯示附近的頁數(shù)

我們顯示頁數(shù)的代碼是這樣的：

「JavaWeb基礎」客戶關系管理系統(tǒng)(修訂版)（完整的客戶關系管理系統(tǒng)）

很明顯，我們只要控制了begin和end中的數(shù)據(jù)，就控制顯示哪10頁了！

①在Page類中多定義兩個成員變量

//記錄JSP頁面開始的頁數(shù)和結束的頁數(shù) private int startPage; private int endPage; //Setter,Getter方法

②開始頁數(shù)和結束頁數(shù)受用戶想看的頁數(shù)影響，在BusinessService的getPageData()加入下面的邏輯

//第一次訪問 page.setStartPage(1); page.setEndPage(10); //不是第一次訪問 if (page.getCurrentPageCount() <= 10) { page.setStartPage(1); page.setEndPage(10); } else { page.setStartPage((int) (page.getCurrentPageCount() – 4)); page.setEndPage((int) (page.getCurrentPageCount() 5)); //如果因為加減角標越界了，那么就設置最前10頁，或者最后10頁 if (page.getStartPage() < 1) { page.setStartPage(1); page.setEndPage(10); } if (page.getEndPage() > page.getTotalPageCount()) { page.setEndPage(page.getTotalPageCount()); page.setStartPage(page.getTotalPageCount() – 9); } }

③：在JSP顯示頁數(shù)時，獲取得到開始頁和結束頁就行了

<%–提供頁數(shù)的界面–%> <c:forEach var=”pageNum” begin=”${page.startPage}” end=”${page.endPage}”> <a href=”${pageContext.request.contextPath}/LookCustomer?currentPageCount=${pageNum}”> [${pageNum}] </a> </c:forEach>

效果：

「JavaWeb基礎」客戶關系管理系統(tǒng)(修訂版)（完整的客戶關系管理系統(tǒng)）

重構優(yōu)化

分頁重構

我們再回頭看看BusinessService中獲取分頁數(shù)據(jù)的代碼：

//既然Page對象代表是分頁數(shù)據(jù)，那么返回Page對象即可！ //web層應該傳入想要看哪一頁數(shù)據(jù)的參數(shù)！ public Page getPageData(String currentPageCount) { Page page = new Page(); //獲取數(shù)據(jù)庫中有多少條記錄，并封裝到Page對象中 Long totalRecord = customerDao.getTotalRecord(); page.setTotalRecord(totalRecord); //算出總頁數(shù)，并封裝到Page對象中 int totalPagecount = (int) (totalRecord % page.getLinesize() == 0 ? totalRecord / page.getLinesize() : totalRecord / page.getLinesize() 1); page.setTotalPageCount(totalPagecount); int start ; int end = page.getLinesize(); //現(xiàn)在又分兩種情況了，如果傳遞進來的參數(shù)是null的，那么說明外界是第一次查詢的 if (currentPageCount == null) { //第一次查詢，就應該設置當前頁數(shù)是第一頁 page.setCurrentPageCount(1); page.setStartPage(1); page.setEndPage(10); start = (int) ((page.getCurrentPageCount() – 1) * page.getLinesize()); List<Customer> customers = customerDao.getPageData(start, end); page.setList(customers); } else { //如果不是第一次，就把外界傳遞進來的頁數(shù)封裝到Page對象中 page.setCurrentPageCount(Long.parseLong(currentPageCount)); start = (int) ((page.getCurrentPageCount() – 1) * page.getLinesize()); if (page.getCurrentPageCount() <= 10) { page.setStartPage(1); page.setEndPage(10); } else { page.setStartPage((int) (page.getCurrentPageCount() – 4)); page.setEndPage((int) (page.getCurrentPageCount() 5)); //如果因為加減角標越界了，那么就設置最前10頁，或者最后10頁 if (page.getStartPage() < 1) { page.setStartPage(1); page.setEndPage(10); } if (page.getEndPage() > page.getTotalPageCount()) { page.setEndPage(page.getTotalPageCount()); page.setStartPage(page.getTotalPageCount() – 9); } } List<Customer> customers = customerDao.getPageData(start, end); page.setList(customers); } return page; }

太太太太太tm復雜，太太太太tm長了?。。。?！我們BusinessService要做的僅僅是調用Dao層的功能，為web層提供數(shù)據(jù)，但我們在方法中使用大量了邏輯判斷，而且這些邏輯判斷都是屬于Page類的！

明確一下：只有獲取數(shù)據(jù)庫總記錄數(shù)是在BusinessService中做的，其他的數(shù)據(jù)變量都是應該在Page類中完成！

在BusinessService獲取了總記錄數(shù)之后，我們要對其他變量進行初始化（根據(jù)總記錄數(shù)，用戶想要看哪一頁的數(shù)據(jù)），算出其他的數(shù)據(jù)（JSP記錄開始頁數(shù)、結束頁數(shù)、總頁數(shù)等等），最好的辦法就是通過Page的構造函數(shù)來實現(xiàn)初始化！

改良后的BusinessService

public Page getPageData2(String currentPageCount) { //獲取得到總記錄數(shù) Long totalPageCount = customerDao.getTotalRecord(); if (currentPageCount == null) { //如果是第一次，那么就將用戶想看的頁數(shù)設置為1 Page page = new Page(1, totalPageCount); List<Customer> customers = customerDao.getPageData(page.getStartIndex(), page.getLinesize()); page.setList(customers); return page; } else { //如果不是第一次，就將獲取得到的頁數(shù)傳遞進去 Page page = new Page(Integer.parseInt(currentPageCount), totalPageCount); List<Customer> customers = customerDao.getPageData(page.getStartIndex(), page.getLinesize()); page.setList(customers); return page; } }

改良后的Page類（原來的Page類只有成員變量和setter、getter方法）

public Page(int currentPageCount, long totalRecord) { //將傳遞進來的currentPageCount初始化 this.currentPageCount = currentPageCount; //總頁數(shù) totalPageCount = (int) (totalRecord % linesize == 0 ? totalRecord / linesize : totalRecord / linesize 1); //總記錄數(shù) this.totalRecord = totalRecord; //開始取數(shù)據(jù)的位置 startIndex = (currentPageCount – 1) * linesize; //如果當前頁小于10，那么開始頁為1，結束頁為10就行了 if (this.currentPageCount <= 10) { this.startPage = 1; this.endPage = 10; } else { startPage = this.currentPageCount – 4; endPage = this.currentPageCount 5; //加減后頁數(shù)越界的情況 if (startPage < 1) { this.startPage = 1; this.endPage = 10; } if (endPage > totalPageCount) { this.startPage = this.currentPageCount – 9; this.endPage = this.totalPageCount; } } }

分頁顯示頁面重構

分頁的顯示頁面都是永恒不變的，我們可以把代碼重構成一個jsp，需要用到分頁顯示頁面的地方，就包含進去就行了！

page.jsp

<%@ page contentType=”text/html;charset=UTF-8″ language=”java” %> <%@taglib prefix=”c” uri=”http://java.sun.com/jsp/jstl/core” %> <%–顯示當前頁數(shù)–%> 當前頁數(shù)是：[${page.currentPageCount}] <%–如果當前的頁碼大于1，才顯示上一步–%> <c:if test=”${page.currentPageCount>1}”> <%–把傳遞過去的頁碼-1就行了–%> <a href=”${pageContext.request.contextPath}/LookCustomer?currentPageCount=${page.currentPageCount-1}”> 上一步 </a> </c:if> <%–提供頁數(shù)的界面–%> <c:forEach var=”page” begin=”${page.startPage}” end=”${page.endPage}”> <a href=”${pageContext.request.contextPath}/LookCustomer?currentPageCount=${page}”> [${page}] </a> </c:forEach> <%–如果當前的頁碼小于總頁數(shù)，才顯示下一步–%> <c:if test=”${page.currentPageCount<page.totalPageCount}”> <%–把傳遞過去的頁碼-1就行了–%> <a href=”${pageContext.request.contextPath}/LookCustomer?currentPageCount=${page.currentPageCount 1}”> 下一步 </a> </c:if> <input type=”text” id=”currentPageCount”> <input type=”button” value=”跳轉” onclick=”goPage()”> 總頁數(shù)是：${page.totalPageCount} 總記錄數(shù)是：${page.totalRecord} <script type=”text/javascript”> /*既然寫上了JavaScript代碼了，就順便驗證輸入框輸入的數(shù)據(jù)是否合法吧*/ function goPage() { /*獲取輸入框控件*/ var input = document.getElementById(“currentPageCount”); /*獲取輸入框的數(shù)據(jù)*/ var value = input.value; if(value==null || value==””){ alert(“請輸入頁碼”); return false; } if(!value.match(“d “)){ alert(“請輸入數(shù)字”); return false; } if(value<1 || value>${page.totalPageCount}){ alert(“請輸入合法數(shù)據(jù)”); return false ; } window.location.href=”${pageContext.request.contextPath}/LookCustomer?currentPageCount=” value; } </script>

用需要用到的地方，導入即可！

<jsp:include page=”page.jsp”></jsp:include>

為了做到更好的通用性，處理分頁數(shù)據(jù)的url應該由Servlet傳進去給Page類，讓Page類封裝起來！要使用的時候，再用Page取出來就行了。

下面寫法已經固定了，不夠靈活！也就是說，下面的url地址不應該寫死的

${pageContext.request.contextPath}/LookCustomer?currentPageCount=${page.currentPageCount 1}

我們可以這樣做：

在Controller上獲取Servlet的名稱，在傳遞用戶想要看的頁數(shù)的同時，把Servlet的url也傳遞進去

String servletName = this.getServletName(); //調用BusinessService的方法，獲取得到所有客戶信息 BusinessService businessService = new BusinessService(); //把Servlet的url也傳遞進去 Page page = businessService.getPageData2(currentPageCount, request.getContextPath() “/” servletName);

在Page類上，多增加一個成員變量

private String url; public String getUrl() { return url; } public void setUrl(String url) { this.url = url; }

在BusinessService接受到web層傳遞進來的url，set到Page對象上就行了！

page.setUrl(url);

我們在jsp頁面跳轉到處理分頁數(shù)據(jù)的Servlet上，就再不用寫死了。直接用Page對象中獲取出來就行了！

<%–把傳遞過去的頁碼-1就行了–%> <a href=”${page.url}?currentPageCount=${page.currentPageCount-1}”> 上一步 </a>

開發(fā)web的刪除和修改

在查詢jsp頁面上，增添刪除和修改的操作鏈接！

「JavaWeb基礎」客戶關系管理系統(tǒng)(修訂版)（完整的客戶關系管理系統(tǒng)）

開發(fā)處理刪除操作的Servlet

超鏈接綁定要刪除用戶的id，帶過去給Controller

controller的代碼也十分簡單：

String id = request.getParameter(“id”); //調用BusinessService層的功能，就可以完成刪除操作了 BusinessService businessService = new BusinessService(); businessService.deleteCustomer(id);

刪除客戶記錄也是一件非常重要的事情，應該提供JavaSrcript代碼詢問是否要真的刪除

在超鏈接控件上綁定事件！

<a href=”${pageContext.request.contextPath}/DeleteCustomer?id=${customer.id}” onclick=” return sureDelete()”>刪除</a> function sureDelete() { var b = window.confirm(“你確定要刪除嗎？”); if(b) { return true; }else { return false; } }

修改操作

修改操作的流程是這樣的：點擊修改超鏈接，跳轉到該用戶的詳細信息頁面，在詳細信息頁面中修改數(shù)據(jù)，再提交修改！【跳轉到用戶詳細信息頁面時，用戶的id還在的，在提交數(shù)據(jù)的時候，記得把id也給到服務器，【id是不包含在表單中的，要我們自己提交過去】！】

開發(fā)提供用戶詳細信息的Servlet

String id = request.getParameter(“id”); BusinessService businessService = new BusinessService(); //通過id獲取得到用戶的詳細信息 Customer customer = businessService.findCustomer(id); request.setAttribute(“customer”, customer); //跳轉到顯示用戶詳細信息的jsp頁面上 request.getRequestDispatcher(“/WEB-INF/customerInformation”).forward(request, response);

開發(fā)顯示用戶信息的JSP【數(shù)據(jù)回顯】

想要日期能夠選擇，記得導入JavaScript代碼，響應事件！

注意：在顯示頁面上，一定要把id傳遞過去給處理表單的Servlet，不然服務器是不知道你要修改哪一條數(shù)據(jù)的！

效果：

「JavaWeb基礎」客戶關系管理系統(tǒng)(修訂版)（完整的客戶關系管理系統(tǒng)）

總結

在dao層中，我們有添加客戶、通過id查找用戶、刪除用戶、修改用戶信息的方法。
日期我們一般用下拉框來給用戶選取，要想下拉框的信息有足夠多的數(shù)據(jù)，我們需要用到JavaScript【DOM編程動態(tài)增加和修改數(shù)據(jù)】
javasrcipt文件不能放在WEB-INF目錄下面
日期的數(shù)據(jù)通過下拉框選取，年、月、日是分散的，我們需要把他們拼接，于是我們也用JavaScript來拼接【減低服務器端的壓力】
開發(fā)工具方法request2Bean，主要用到了BeanUtils框架，這樣就不用在Servlet一個一個封裝了。
在JSP判斷集合是否有元素時，我們可以用EL表達式${empty(集合)}。
如果記錄數(shù)有很多，我們應該使用分頁技術，一般地，我們使用Page類來封裝分頁的數(shù)據(jù)
要使用分頁技術，就必須在數(shù)據(jù)庫用查詢總記錄數(shù)，通過總記錄數(shù)，就可以算出總頁數(shù)了【每頁顯示多少條記錄由我們說了算】
在dao層還要編寫獲取具體的分頁數(shù)據(jù)，從哪里開始，哪里結束，返回一個List集合，再把List集合封裝到Page對象上
由于獲取分頁數(shù)據(jù)需要當前的頁數(shù)是多少，（所以在service中要判斷當前頁數(shù)是否存在，如果不存在，那么就設置為1）【更新，我認為在Controller判斷會好一點】
分頁中，我們還支持上一頁和下一頁的功能，如果頁數(shù)大于1，才顯示上一頁，如果頁數(shù)小于1，才顯示下一頁。
給出下拉框進行頁數(shù)跳轉，使用JavaScript事件機制，獲取頁數(shù)，再提交給Servlet處理即可
我們還要控制頁數(shù)的顯示，因為不可能有100頁，我們就顯示100頁，這樣是不可能的。在Page類中維護兩個變量，startPage，endPage。我們規(guī)定每次只能顯示10頁數(shù)據(jù)，如果第一次訪問就顯示1-10頁。如果當前頁數(shù)大于10，那么就顯示6-15頁。如果角標越界了，那么就顯示前10頁或者后10頁
我們把顯示分頁的頁面封裝成單獨的jsp，使用的Servlet連接也可以用url變量來維護。
前臺數(shù)據(jù)做拼接，最終都是把拼接好的數(shù)據(jù)用一個隱藏域封裝起來，隨后讓form表單一起提交