EL和JSTL练习

    技术2024-05-08  75

    文章目录

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

    本文章基于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>
    Processed: 0.016, SQL: 10