EL和JSTL练习

最新推荐文章于 2020-10-04 21:40:15 发布

严格要求自己

最新推荐文章于 2020-10-04 21:40:15 发布

阅读量420

点赞数

CC 4.0 BY-SA版权

分类专栏： java web练习文章标签： javabean web bootstrap gwt jsp

本文链接：https://blog.youkuaiyun.com/qq_43050847/article/details/107113213

java web练习专栏收录该内容

14 篇文章

订阅专栏

文章目录

- 购物车页面的改写
- 订单详情页改写

本文章基于JSP练习（cookie、隐藏域使用等），对部分页面进行改写。

购物车页面的改写

在这里插入图片描述

// 购物车页面，仅body标签部分
<body>
<%@include file="/jsp/notNullCharge.jsp" %>
<div class="container">
    <div class="row">
        <div class="span12">
            <h3>
                尊贵的会员：${sessionScope.loginUser.uname}
            </h3>
            <ul class="nav nav-tabs">
                <li class="active">
                    <a href="#">购物车</a>
                </li>
            </ul>
            <table class="table table-striped">
                <thead>
                <tr>
                    <th>商品名称</th>
                    <th>商品价格</th>
                    <th>商品图片</th>
                    <th>商品描述</th>
                    <th>商品数量</th>
                    <th>小计</th>
                    <th>操作</th>
                </tr>
                </thead>
                <tbody>
                <c:forEach items="${CartProd}" var="product">
                <tr>
                    <td>${product.pname}</td>
                    <td>${product.price}</td>
                    <td><img src="${pageContext.request.contextPath}/${product.pimg}"></td>
                    <td>${product.pdesc}</td>
                    <td><input type="button" value="-" class="mybtn1"
                               <c:if test="${product.pnum==1}" var="flag" scope="page">
                                disabled
                                </c:if>
                    >
                        <input type="text" class="prodNum" value="${product.pnum}" readonly cookieKey="prod_${product.pid}">
                        <input type="button" value="+" class="mybtn2">
                    </td>
                    <c:set var="count" value="${product.price.multiply(product.pnum)}" scope="page"/>
                    <c:set var="totalPay" value="${count+totalPay}" scope="page" />
                    <td>${count}</td>
                    <td><input type="button" class="btn btn-primary deleteProd" value="删除"
                               cookieKey="prod_${product.pid}" cookieVal="${product.pnum}">
                    </td>
                </tr>
                </c:forEach>
                <tr class="danger totalPay">
                    <td colspan="5">合计</td>
                    <td colspan="2">
                        ${totalPay}
                    </td>
                </tr>
                </tbody>
            </table>
            <form action="${pageContext.request.contextPath}/PlaceOrderServlet" method="post">
                <input id="totalPay" type="hidden" name="totalPay" value="${totalPay}"/>
                <input class="btn btn-danger" type="submit" value="下单结算" />
            </form>
        </div>
    </div>
</div>
</body>

订单详情页改写

request.getParameter（）取值的EL写法
List<Map<String, Object>> 集合的JSTL遍历方式

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<html>
<head>
    <title>订单详情页</title>
    <link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/css/bootstrap.min.css"/>
    <script type="text/javascript" src="${pageContext.request.contextPath}/js/jquery-3.4.1.min.js"></script>
    <script src="${pageContext.request.contextPath}/js/bootstrap.min.js" type="text/javascript"
            charset="utf-8"></script>
    <style>
        .mytr td img {
            width: 50px;
            height: 50px;
        }
    </style>

</head>
<body>
<%@include file="/jsp/notNullCharge.jsp" %>
<div class="container">
    <div class="row">
        <div class="span12">
            <h3>
                欢迎您：${sessionScope.loginUser.uname}
            </h3>
            <ul class="nav nav-tabs">
                <li role="presentation">
                    <a href="${pageContext.request.contextPath}/QueryAllProductServlet">首页</a>
                </li>
                <li role="presentation" class="active">
                    <a href="#">订单详情页</a>
                </li>
            </ul>
            <br>
            <table class="table table-bordered">
                <tr class="danger">
                    <th>订单编号</th>
                    <th>付款账户</th>
                    <th>订单总额</th>
                    <th>付款时间</th>
                </tr>
                <tr class="info">
                    <td>${param.get("oid")}
                    </td>
                    <td>${param.get("uname")}
                    </td>
                    <td>${param.get("osum")}
                    </td>
                    <td>${param.get("odate")}
                    </td>
                </tr>
            </table>

            <table class="table table-striped">
                <thead>
                <tr class="danger">
                    <th>购买商品名称</th>
                    <th>购买商品价格</th>
                    <th>购买商品图片</th>
                    <th>购买商品数量</th>
                </tr>
                </thead>
                <tbody>
                <c:forEach items="${orderDetails}" var="map">
                    <tr class="mytr">
                        <td>${map.get("pname")} <%--pname是key值--%>
                        </td>
                        <td>${map.get("price")}
                        </td>
                        <td><img src="${pageContext.request.contextPath}/${map.get("pimg")}"/>
                        </td>
                        <td>${map.get("pnum")}
                        </td>
                    </tr>
                </c:forEach>
                </tbody>
            </table>
            <a class="btn btn-info" href="${pageContext.request.contextPath}/OrderServlet">返回上一级</a>
        </div>
    </div>
</div>
</body>
</html>