Java web应用案例:西蒙购物网(下)

四、实现步骤

(九)准备图片资源

在web目录里创建images目录,存放项目所需图片文件
Java web应用案例:西蒙购物网(下)_第1张图片

(十)CSS样式文件

在web目录里常见css子目录,在里面创建main.css文件
Java web应用案例:西蒙购物网(下)_第2张图片
Java web应用案例:西蒙购物网(下)_第3张图片
Java web应用案例:西蒙购物网(下)_第4张图片

/* 样式 */
body {
    margin: 0px;
    text-align: center;
    background: url("../images/frontBack.jpg") no-repeat;
    background-size: 100%
}

table {
    margin: 0 auto;
    font-size: 14px;
    color: #333333;
    border-width: 1px;
    border-color: khaki;
    border-collapse: collapse;
}

table th {
    border-width: 1px;
    padding: 8px;
    border-style: solid;
    border-color: gainsboro;
    background-color: honeydew;
}

table td {
    border-width: 1px;
    padding: 8px;
    border-style: solid;
    border-color: gainsboro;
    background-color: #ffffff;
}

/*登录页面样式*/
.login {
    width: 400px;
    height: 340px;
    background-color: honeydew;
    border: solid 2px darkgrey;
    left: 50%;
    top: 50%;
    position: absolute;
    margin: -170px 0 0 -200px;
}

.login .websiteTitle, .title {
    border: solid 1px floralwhite;
}

/*注册页面样式*/
.register {
    width: 400px;
    height: 350px;
    background-color: honeydew;
    border: solid 2px darkgrey;
    left: 50%;
    top: 50%;
    position: absolute;
    margin: -175px 0 0 -200px;
}

/*显示类别页面样式*/
.showCategory {
    width: 400px;
    height: 350px;
    background-color: honeydew;
    border: solid 2px darkgrey;
    left: 50%;
    top: 50%;
    position: absolute;
    margin: -150px 0 0 -200px;
}

/*生成订单页面样式*/
.makeOrder {
    width: 400px;
    height: 400px;
    background-color: honeydew;
    border: solid 2px darkgrey;
    left: 50%;
    top: 50%;
    position: absolute;
    margin: -200px 0 0 -200px;
}

/*显示订单页面样式*/
.showOrder {
    width: 400px;
    height: 400px;
    background-color: honeydew;
    border: solid 2px darkgrey;
    left: 50%;
    top: 50%;
    position: absolute;
    margin: -200px 0 0 -200px;
}
(十一)JavaScript脚本文件

Java web应用案例:西蒙购物网(下)_第5张图片
Java web应用案例:西蒙购物网(下)_第6张图片

/**
 * 检验登录表单
 *
 * @returns {Boolean}
 */
function checkLoginForm() {
    var username = document.getElementById("username");
    var password = document.getElementById("password");
    if (username.value == "") {
        alert("用户名不能为空!");
        username.focus();
        return false;
    }
    if (password.value == "") {
        alert("密码不能为空!");
        password.focus();
        return false;
    }
    return true;
}

/**
 * 检验注册表单
 *
 * @returns {Boolean}
 */
function checkRegisterForm() {
    var username = document.getElementById("username");
    var password = document.getElementById("password");
    var telephone = document.getElementById("telephone");
    if (username.value == "") {
        alert("用户名不能为空!");
        username.focus();
        return false;
    }
    if (password.value == "") {
        alert("密码不能为空!");
        password.focus();
        return false;
    }

    var pattern = "/^(13[0-9]|14[0-9]|15[0-9]|18[0-9])\d{8}$/";
    if (!pattern.exec(telephone)) {
        alert("非法手机号!");
        telephone.focus();
        return false;
    }
    return true;
}
(十二)添加JSTL的jar包

在WEB-INF\lib目录里添加支持jstl的jar包
jar包下载地址
http://tomcat.apache.org/taglibs/standard/
Java web应用案例:西蒙购物网(下)_第7张图片
Java web应用案例:西蒙购物网(下)_第8张图片
下载后全部导入进web的lib包下
Java web应用案例:西蒙购物网(下)_第9张图片
再全部解开
Java web应用案例:西蒙购物网(下)_第10张图片
Java web应用案例:西蒙购物网(下)_第11张图片
Java web应用案例:西蒙购物网(下)_第12张图片

(十三)展现层页面(XXX.jsp)
1、创建登录页面login.jsp

Java web应用案例:西蒙购物网(下)_第13张图片

<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>

<c:set var="path" value="${pageContext.request.contextPath}"/>
<c:set var="basePath"
       value="${pageContext.request.scheme}://${pageContext.request.serverName}:${pageContext.request.serverPort}${path}/"/>
<!DOCTYPE html>
<html>
<head>
    <title>用户登录</title>
    <base href="${basePath}">
    <script src="scripts/check.js" type="text/javascript"></script>
    <link href="css/main.css" rel="stylesheet" type="text/css"/>
</head>
<body>

<div class="login">
    <div class="websiteTitle">
        <h1>西蒙购物网</h1>
    </div>
    <div class="title">
        <h3>用户登录</h3>
    </div>
    <div class="main">
        <form id="frmLogin" action="login" method="post">
            <table>
                <tr>
                    <td align="center">账号</td>
                    <td><input id="username" type="text" name="username"/></td>
                </tr>
                <tr>
                    <td align="center">密码</td>
                    <td><input id="password" type="password" name="password"/></td>
                </tr>
                <tr align="center">
                    <td colspan="2">
                        <input type="submit" value="登录" οnclick="return checkLoginForm();"/>
                        <input type="reset" value="重置"/>
                    </td>
                </tr>
            </table>
        </form>
    </div>
    <div class="footer">
        <p>如果你不是本站用户,单击<a href="frontend/register.jsp">此处</a>注册。</p>
    </div>
</div>

<c:if test="${registerMsg!=null}">
    <script type="text/javascript">alert("${registerMsg}")</script>
    <c:remove var="registerMsg"/>
</c:if>

<c:if test="${loginMsg!=null}">
    <script type="text/javascript">alert("${loginMsg}")</script>
    <c:remove var="loginMsg"/>
</c:if>
</body>
</html>

在web.xml文件里将login.jsp设置为首页文件
Java web应用案例:西蒙购物网(下)_第14张图片
重启服务器:
不输入用户名与密码,单击【登录】按钮:

输入用户名,但不输入密码,单击【登录】按钮:

输入管理员用户名与密码:admin,12345

Java web应用案例:西蒙购物网(下)_第15张图片
去服务器端控制台查看输出信息:
Java web应用案例:西蒙购物网(下)_第16张图片
重启服务器,登陆普通用户(普通用户与管理员用户有区别):郑晓红,11111

Java web应用案例:西蒙购物网(下)_第17张图片
上面两个报错页面,是因为两个要跳转的页面我们都还没有创建,所以找不到两个页面,所以会报错,并不是代码问题

虽然两个都登陆成功了,但是可以看出,登陆后跳转的页面明显不一样

服务器端控制台查看输出信息:
Java web应用案例:西蒙购物网(下)_第18张图片
重启服务器,输入错误的用户名或密码:李文丽,12340

Java web应用案例:西蒙购物网(下)_第19张图片

2、创建注册页面register.jsp

Java web应用案例:西蒙购物网(下)_第20张图片

<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>

<c:set var="path" value="${pageContext.request.contextPath}"/>
<c:set var="basePath"
       value="${pageContext.request.scheme}://${pageContext.request.serverName}:${pageContext.request.serverPort}${path}/"/>
<!DOCTYPE html>
<html>
<head>
    <title>用户注册</title>
    <base href="${basePath}">
    <link href="css/main.css" rel="stylesheet" type="text/css"/>
    <script src="scripts/check.js" type="text/javascript"></script>
</head>
<body>

<div class="register">
    <div class="websiteTitle">
        <h1>西蒙购物网</h1>
    </div>
    <div class="title">
        <h3>用户注册</h3>
    </div>
    <div class="main">
        <form action="register" method="post">
            <table>
                <tr>
                    <td>账号</td>
                    <td><input id="username" type="text" name="username"/></td>
                </tr>
                <tr>
                    <td>密码</td>
                    <td><input id="password" type="password" name="password"/></td>
                </tr>
                <tr>
                    <td align="center">电话</td>
                    <td><input id="telephone" type="text" name="telephone"/></td>
                </tr>
                <tr align="center">
                    <td colspan="2">
                        <input type="submit" value="注册" onclick="return checkRegisterForm();"/>
                        <input type="reset" value="重置"/></td>
                </tr>
            </table>
        </form>
    </div>
    <div class="footer">
        <p><a href="login.jsp">切换到登录页面</a></p>
    </div>
</div>

<c:if test="${registerMsg!=null}">
    <script type="text/javascript">alert("${registerMsg}")</script>
    <c:set var="registerMsg" value=""/>
</c:if>
</body>
</html>

启动服务器,进行注册测试:


什么也不输入,单击【注册】按钮:

输入用户名,不输入密码,单击【注册】按钮:
Java web应用案例:西蒙购物网(下)_第21张图片
输入用户名、密码和电话,单击【注册】按钮:

Java web应用案例:西蒙购物网(下)_第22张图片
打开用户表,查看新添加的用户:
Java web应用案例:西蒙购物网(下)_第23张图片

3、创建商品类别页面showCategory.jsp

Java web应用案例:西蒙购物网(下)_第24张图片

<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>

<c:set var="path" value="${pageContext.request.contextPath}"/>
<c:set var="basePath"
       value="${pageContext.request.scheme}://${pageContext.request.serverName}:${pageContext.request.serverPort}${path}/"/>
<!DOCTYPE html>
<html>
<head>
    <title>显示商品类别</title>
    <base href="${basePath}">
    <link href="css/main.css" rel="stylesheet" type="text/css"/>
</head>
<body>

<div class="showCategory">
    <div class="websiteTitle">
        <h1>西蒙购物网</h1>
    </div>
    <div>
        登录用户:<span style="color: red;">${username}</span>
        <c:forEach var="i" begin="1" end="5">
        </c:forEach>
        <a href="logout">注销</a>
    </div>
    <div class="title">
        <h3>商品类别</h3>
    </div>
    <div class="main">
        <table>
            <tr>
                <th>类别编号</th>
                <th>商品类别</th>
            </tr>
            <c:forEach var="category" items="${categories}">
                <tr align='center'>
                    <td>${category.id}</td>
                    <td width="150">
                        <a href="showProduct?categoryId=${category.id}">${category.name}</a>
                    </td>
                </tr>
            </c:forEach>
        </table>
    </div>
</div>
</body>
</html>

启动服务器,显示登录页面,输入普通用户:郑晓红,11111:
Java web应用案例:西蒙购物网(下)_第25张图片
Java web应用案例:西蒙购物网(下)_第26张图片
这里报错是因为没有找到显示内容,去找错:
Java web应用案例:西蒙购物网(下)_第27张图片
Java web应用案例:西蒙购物网(下)_第28张图片
上面这个页面是登陆检验,如果你从这里直接跳到显示页面的话,之间跳过拿到数据的过程,就没有数据,那么就没有显示,所以,在这里你要跳ShowCategoryServlet代码页,从这里拿到要显示的数据,并从这里跳转到显示页面。
Java web应用案例:西蒙购物网(下)_第29张图片

重启服务器,登陆普通用户:

点击【家用电器】,查看结果:
Java web应用案例:西蒙购物网(下)_第30张图片
因为还未创建该页面,跳转会失败,但是在服务器端控制台还是可以看到输出信息:
Java web应用案例:西蒙购物网(下)_第31张图片
不用重启服务器,直接返回上一级:
Java web应用案例:西蒙购物网(下)_第32张图片
单击【注销】超链接,返回登录页面:

成功跳转到登陆界面:
Java web应用案例:西蒙购物网(下)_第33张图片

4、创建购物车页面showCart.jsp

Java web应用案例:西蒙购物网(下)_第34张图片

<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>

<c:set var="path" value="${pageContext.request.contextPath}"/>
<c:set var="basePath"
       value="${pageContext.request.scheme}://${pageContext.request.serverName}:${pageContext.request.serverPort}${path}/"/>
<!DOCTYPE html>
<html>
<head>
    <title>显示购物车</title>
    <base href="${basePath}">
</head>
<body>
<h3>${username}的购物车</h3>
<table>
    <tr>
        <th>商品编号</th>
        <th>商品名称</th>
        <th>销售价格</th>
        <th>购买数量</th>
        <th>合计金额</th>
        <th>用户操作</th>
    </tr>
    <c:forEach var="shoppingItem" items="${shoppingTable}">
        <tr>
            <td>${shoppingItem.id}</td>
            <td>${shoppingItem.name}</td>
            <td>¥${shoppingItem.price}</td>
            <td>${shoppingItem.amount}</td>
            <td>¥${shoppingItem.sum}</td>
            <td><a href="operateCart?id=${shoppingItem.id}&operation=delete">删除</a></td>
        </tr>
    </c:forEach>
    <tr>
        <th>总金额</th>
        <td></td>
        <td></td>
        <td></td>
        <c:choose>
            <c:when test="${totalPrice==null}">
                <th style="color: red">0.00</th>
            </c:when>
            <c:otherwise>
                <th style="color: red">¥${totalPrice}</th>
            </c:otherwise>
        </c:choose>
        <td></td>
    </tr>
</table>
<hr width="800px">
<c:choose>
    <c:when test="${totalPrice==null}">
        <a href="frontend/makeOrder.jsp?totalPrice=0.00">生成订单</a>
    </c:when>
    <c:otherwise>
        <a href="frontend/makeOrder.jsp?totalPrice=${totalPrice}">生成订单</a>
    </c:otherwise>
</c:choose>
<c:if test="${orderMsg!=null}">
    <script type="text/javascript">alert("${orderMsg}")</script>
    <c:remove var="orderMsg"/>
</c:if>
</body>
</html>

这个页面要包含在显示商品页面里,因此没有导入CSS样式文件。
重启服务器,以普通用户登录
Java web应用案例:西蒙购物网(下)_第35张图片

5、创建商品页面showProduct.jsp

Java web应用案例:西蒙购物网(下)_第36张图片

<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>

<c:set var="path" value="${pageContext.request.contextPath}"/>
<c:set var="basePath"
       value="${pageContext.request.scheme}://${pageContext.request.serverName}:${pageContext.request.serverPort}${path}/"/>
<!DOCTYPE html>
<html>
<head>
    <title>显示商品信息</title>
    <base href="${basePath}">
    <link href="css/main.css" rel="stylesheet" type="text/css"/>
</head>
<body>
<h1>西蒙购物网</h1>
<hr width="700px">
登录用户:<span style="color: red;">${username}</span>
<c:forEach var="i" begin="1" end="5">
</c:forEach>
<a href="logout">注销</a></td>
<hr width="700px">
欢迎选购【<span style="color: blue; font-weight: bold;">${categoryName}</span>】类商品
<hr width="700px">
<table border="0">
    <c:forEach varStatus="status" var="product" items="${products}">
        <c:if test="${status.count%5==0}">
            <tr>
        </c:if>
        <td>
            <table border="0">
                <tr><img src="images/product${product.id}.jpg" width="60px" height="60px"></tr>
                <tr>
                    <td><b>商品编号:</b></td>
                    <td>${product.id}</td>
                </tr>
                <tr>
                    <td><b>商品名称:</b></td>
                    <td>${product.name}</td>
                </tr>
                <tr>
                    <td><b>销售价格:</b></td>
                    <td>${product.price}</td>
                </tr>
                <tr>
                    <td><b>上架时间:</b></td>
                    <td><fmt:formatDate value="${product.addTime}" pattern="yyyy-MM-dd"/></td>
                </tr>
                <tr>
                    <td><b>用户操作:</b></td>
                    <td><a href="operateCart?id=${product.id}&operation=add">加入购物车</a></td>
                </tr>
            </table>
        </td>
        <c:if test="${status.count%4==0}">
            </tr>
        </c:if>
    </c:forEach>
</table>
<hr width="700px">
<a href="showCategory">返回商品类别页面</a>
<hr width="700px">
<jsp:include page="showCart.jsp"/>
</body>
</html>

启动服务器,输入普通用户:郑晓红,11111,查看是否能跳转到商品显示类别页面,并从商品显示页面从超链接进行跳转:
Java web应用案例:西蒙购物网(下)_第37张图片


但是这里有点小错,类别名没有显示出来。页面跳转成功,但是类别名没有成功传递。
修改ShowProductServlet,将类别名放在session里,而不是通过url传递参数。
Java web应用案例:西蒙购物网(下)_第38张图片
重启服务器,登录成功后,选择和刚刚一样的【家用电器】类别,查看类别名称是否能正常显示出来:

这个时候尝试点击加入购物车,看看能不能实现:
Java web应用案例:西蒙购物网(下)_第39张图片
这是会明显的报错,这是因为你没有写点击【加入购物车】之后的方法,你还要对购物车进行操作,加入或删除商品等:

新建操作购物车控制程序OperateCartServlet:

Java web应用案例:西蒙购物网(下)_第40张图片

package net.azc.shop.servlet;
/**
 * 功能:操作购物车控制程序
 * 作者:azc
 * 日期:2019年12月14日
 */

import java.io.IOException;
import java.util.LinkedHashMap;

import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

import net.azc.shop.service.ProductService;

@WebServlet("/operateCart")
public class OperateCartServlet extends HttpServlet {
    private static final long serialVersionUID = 1L;

    protected void doGet(HttpServletRequest request, HttpServletResponse response)
            throws ServletException, IOException {
        // 获取商品标识符
        int id = Integer.parseInt(request.getParameter("id"));
        // 获取商品操作
        String operation = request.getParameter("operation");

        // 从session里获取购物车(键:商品标识符;值:购买数量)
        LinkedHashMap<Integer, Integer> cart = (LinkedHashMap<Integer, Integer>) request.getSession()
                .getAttribute("cart");
        // 判断购物车是否为空
        if (cart == null) {
            // 创建购物车
            cart = new LinkedHashMap<Integer, Integer>();
            // 将购物车保存到session里,便于用户在不同页面访问购物车
            request.getSession().setAttribute("cart", cart);
        }

        if (operation.equals("add")) {
            // 将商品添加到购物车
            if (cart.containsKey(id)) { // 该商品已购买过
                // 购买数量增加1
                cart.put(id, cart.get(id) + 1);
            } else { // 该商品未曾购买
                // 购买数量设置为1
                cart.put(id, 1);
            }
        } else if (operation.equals("delete")){
            // 将商品从购物车删除
            if (cart.get(id) > 1) {
                // 购买数量减少1
                cart.put(id, cart.get(id) - 1);
            } else {
                // 从购物车里删除该商品
                cart.remove(id);
            }
        }

        // 创建商品服务对象
        ProductService productService = new ProductService();
        // 获取该商品类别标识符
        int categoryId = productService.findProductById(id).getCategoryId();
        // 重定向到显示购物车控制程序
        response.sendRedirect(request.getContextPath() + "/showCart?categoryId=" + categoryId);
    }
}

同一件商品可以多次加入购物车,也可以从购物车删除掉选购的商品。如果一件商品加入购物车的数量大于1,那么执行一次删除操作就是让购物车该商品数量减少1,直到减为0,即购物车里删除掉该商品。

创建显示购物车控制程序ShowCartServlet:

Java web应用案例:西蒙购物网(下)_第41张图片

package net.azc.shop.servlet;
/**
 * 功能:显示购物车控制程序
 * 作者:azc
 * 日期:2019年12月14日
 */

import java.io.IOException;
import java.util.ArrayList;
import java.util.HashMap;
import java.util.LinkedHashMap;
import java.util.List;

import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import javax.servlet.http.HttpSession;

import net.azc.shop.bean.Product;
import net.azc.shop.service.ProductService;

@WebServlet("/showCart")
public class ShowCartServlet extends HttpServlet {
    private static final long serialVersionUID = 1L;

    protected void doGet(HttpServletRequest request, HttpServletResponse response)
            throws ServletException, IOException {
        // 获取商品类别标识符
        int categoryId = Integer.parseInt(request.getParameter("categoryId"));
        // 获取session对象
        HttpSession session = request.getSession();
        // 获取购物车
        LinkedHashMap<Integer, Integer> cart = (LinkedHashMap<Integer, Integer>) session.getAttribute("cart");

        // 判断购物车是否为空
        if (cart != null) {
            // 定义购物表
            List<HashMap<String, Object>> shoppingTable = new ArrayList<HashMap<String, Object>>();
            // 创建商品服务对象
            ProductService productService = new ProductService();
            // 购物总金额
            double totalPrice = 0.0;
            // 遍历购物车
            for (Integer id : cart.keySet()) {
                // 获取商品对象
                Product product = productService.findProductById(id);
                // 生成购物表记录
                HashMap<String, Object> shoppingItem = new HashMap<String, Object>();
                shoppingItem.put("id", product.getId());
                shoppingItem.put("name", product.getName());
                shoppingItem.put("price", product.getPrice());
                shoppingItem.put("amount", cart.get(id));
                shoppingItem.put("sum", product.getPrice() * cart.get(id));
                // 将购物表记录添加到购物表中
                shoppingTable.add(shoppingItem);
                // 累加购买总金额
                totalPrice = totalPrice + (Double) shoppingItem.get("sum");
            }

            // 将购物表和购买总金额保存到session里
            session.setAttribute("shoppingTable", shoppingTable);
            session.setAttribute("totalPrice", totalPrice);

            // 重定向到显示商品控制程序
            response.sendRedirect(request.getContextPath() + "/showProduct?categoryId=" + categoryId);
        } else {
            System.out.println("购物车里没有类别号为[" + categoryId + "]的商品!");
        }
    }

    protected void doPost(HttpServletRequest request, HttpServletResponse response)
            throws ServletException, IOException {
        doGet(request, response);
    }
}

再次运行tomcat服务器,重新登陆:

6、创建生成订单页面makeOrder.jsp

Java web应用案例:西蒙购物网(下)_第42张图片

<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>

<c:set var="path" value="${pageContext.request.contextPath}"/>
<c:set var="basePath"
       value="${pageContext.request.scheme}://${pageContext.request.serverName}:${pageContext.request.serverPort}${path}/"/>
<!DOCTYPE html>
<html>
<head>
    <title>生成订单</title>
    <base href="${basePath}">
    <link href="css/main.css" rel="stylesheet" type="text/css"/>
</head>
<body>
<div class="makeOrder">
    <div class="websiteTitle">
        <h1>西蒙购物网</h1>
    </div>
    <div>
        登录用户:<span style="color: red;">${username}</span>
        <c:forEach var="i" begin="1" end="5">
             
        </c:forEach>
        <a href="logout">注销</a>
    </div>
    <div class="title">
        <h3>生成订单</h3>
    </div>
    <div class="main">
        <form action="makeOrder" method="post">
            <table>
                <tr>
                    <td>用户名</td>
                    <td><input type="text" name="username" readonly="readonly"
                               value="${username}"/></td>
                </tr>
                <tr>
                    <td>联系电话</td>
                    <td><input type="text" name="telephone"/></td>
                </tr>
                <tr>
                    <td>总金额</td>
                    <td><input type="text" name="totalPrice" readonly="readonly"
                               value="${totalPrice}"/></td>
                </tr>
                <tr>
                    <td>送货地址</td>
                    <td><input type="text" name="deliveryAddress"/></td>
                </tr>
                <tr align="center">
                    <td colspan="2"><input type="submit" value="生成订单"/> <input
                            type="reset" value="重置"/></td>
                </tr>
            </table>
        </form>
    </div>
    <div class="footer">
        <p><a href="showCategory">返回商品类别页面</a></p>
    </div>
</div>
</body>
</html>
7、创建显示订单页面showOrder.jsp

Java web应用案例:西蒙购物网(下)_第43张图片

<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>

<c:set var="path" value="${pageContext.request.contextPath}"/>
<c:set var="basePath"
       value="${pageContext.request.scheme}://${pageContext.request.serverName}:${pageContext.request.serverPort}${path}/"/>
<!DOCTYPE html>
<html>
<head>
    <title>显示订单</title>
    <base href="${basePath}">
    <link href="css/main.css" rel="stylesheet" type="text/css"/>
</head>
<body>
<div class="showOrder">
    <div class="websiteTitle">
        <h1>西蒙购物网</h1>
    </div>
    <div>
        登录用户:<span style="color: red;">${username}</span>
        <c:forEach var="i" begin="1" end="5">
        </c:forEach>
        <a href="logout">注销</a>
    </div>
    <div class="title">
        <h3>生成订单</h3>
    </div>
    <div class="main">
        <table border="1" cellspacing="0">
            <tr>
                <th>订单编号</th>
                <td>${lastOrder.id}</td>
            </tr>
            <tr>
                <th>用户名</th>
                <td>${lastOrder.username}</td>
            </tr>
            <tr>
                <th>联系电话</th>
                <td>${lastOrder.telephone}</td>
            </tr>
            <tr>
                <th>总金额</th>
                <td>${lastOrder.totalPrice}</td>
            </tr>
            <tr>
                <th>送货地址</th>
                <td>${lastOrder.deliveryAddress}</td>
            </tr>
        </table>
    </div>
    <div class="footer">
        <p><a href="pay" οnclick="alert('${lastOrder.username},支付成功!');">支付</a></p>
    </div>
</div>
</body>
</html>

对生成订单与显示订单进行测试:
重启服务器,将一些商品加入购物车,单击生成订单,查看情况:
Java web应用案例:西蒙购物网(下)_第44张图片
点击后就会跳转到 生成订单 的页面:

再输入电话和送货地址,点击“重置”,就会清空电话和地址,重新填写:


再次输入电话和地址,点击生成订单:
Java web应用案例:西蒙购物网(下)_第45张图片
发现报错了,这里的错应该和上面添加购物车的错误是一样的,没有写对应的点击生成订单之后的操作的代码,

创建生成订单控制程序MakeOrderServlet:

Java web应用案例:西蒙购物网(下)_第46张图片

package net.azc.shop.servlet;
/**
 * 功能:生成订单控制程序
 * 作者:azc
 * 日期:2019年12月14日
 */

import java.io.IOException;
import java.sql.Timestamp;
import java.util.Date;
import java.util.List;

import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import javax.servlet.http.HttpSession;

import net.azc.shop.bean.Order;
import net.azc.shop.bean.User;
import net.azc.shop.service.OrderService;
import net.azc.shop.service.UserService;
import net.azc.shop.service.OrderService;
import net.azc.shop.service.UserService;

@WebServlet("/makeOrder")
public class MakeOrderServlet extends HttpServlet {
    private static final long serialVersionUID = 1L;

    protected void doGet(HttpServletRequest request, HttpServletResponse response)
            throws ServletException, IOException {
        // 设置请求对象的字符编码
        request.setCharacterEncoding("utf-8");
        // 获取表单提交数据
        String username = request.getParameter("username");
        String telephone = request.getParameter("telephone");
        Double totalPrice = Double.parseDouble(request.getParameter("totalPrice"));
        String deliveryAddress = request.getParameter("deliveryAddress");
        // 创建订单对象
        Order order = new Order();
        // 设置订单属性
        order.setUsername(username);
        order.setTotalPrice(totalPrice);
        order.setTelephone(telephone);
        order.setDeliveryAddress(deliveryAddress);
        order.setOrderTime(new Date());
        // 创建订单服务
        OrderService orderService = new OrderService();
        // 添加订单
        orderService.addOrder(order);
        // 获取最后一个订单
        Order lastOrder = orderService.findLastOrder();
        // 保存到session里
        request.getSession().setAttribute("lastOrder", lastOrder);
        // 重定向到显示订单页面
        response.sendRedirect(request.getContextPath() + "/frontend/showOrder.jsp");
    }

    protected void doPost(HttpServletRequest request, HttpServletResponse response)
            throws ServletException, IOException {
        doGet(request, response);
    }
}

然后再次重启服务器,登陆之后挑几件商品,看能否生成订单:

这次成功生成订单,点击支付,看看能不能成功支付:
Java web应用案例:西蒙购物网(下)_第47张图片
还是报错了,和上面一样的错,再次修改:

创建支付处理程序PayServlet:

Java web应用案例:西蒙购物网(下)_第48张图片
Java web应用案例:西蒙购物网(下)_第49张图片

你可能感兴趣的:(Java web应用案例:西蒙购物网(下))