案例39-后台查询订单详情代码实现
生活随笔
收集整理的這篇文章主要介紹了
案例39-后台查询订单详情代码实现
小編覺(jué)得挺不錯(cuò)的,現(xiàn)在分享給大家,幫大家做個(gè)參考.
1 admin/order/list.jsp代碼
<%@ page language="java" pageEncoding="UTF-8"%> <%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %> <HTML><HEAD><meta http-equiv="Content-Language" content="zh-cn"><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><link href="${pageContext.request.contextPath}/css/Style1.css" rel="stylesheet" type="text/css" /><script language="javascript" src="${pageContext.request.contextPath}/js/public.js"></script><!-- 彈出層插件 --><link href="${pageContext.request.contextPath}/css/popup_layer.css" type="text/css" rel="stylesheet"/><script type="text/javascript" src="${pageContext.request.contextPath}/js/jquery-1.8.3.min.js"></script><script type="text/javascript" src="${pageContext.request.contextPath}/js/popup_layer.js"></script><!-- 調(diào)用插件彈出層的方法 --><script type="text/javascript">$(function(){//彈出層插件調(diào)用new PopupLayer({trigger:".clickedElement", //觸發(fā)點(diǎn) 點(diǎn)擊誰(shuí)彈出這個(gè)div popupBlk:"#showDiv", //彈出哪個(gè)div closeBtn:"#closeBtn", //關(guān)閉按鈕 useOverlay:true});});// 點(diǎn)擊按鈕查詢訂單的詳情function findOrderInfoByOid(oid){//清理上一次顯示的內(nèi)容 $("#showDivTab").html("");//訂單編號(hào) $("#shodDivOid").html("");//顯示加載圖片 $("#loading").css("display","block");//ajax異步訪問(wèn)數(shù)據(jù) $.post("${pageContext.request.contextPath}/admin?method=findOrderInfoByOid",{"oid":oid},function(data){//隱藏加載圖片 $("#loading").css("display","none");/** [* {"shop_price":5999.0,"count":2,"pname":"微星(MSI)GE62 2QC-264XCN","pimage":"products/1/c_0042.jpg","subtotal":11998.0},* {"shop_price":1299.0,"count":1,"pname":"小米 4c 標(biāo)準(zhǔn)版","pimage":"products/1/c_0001.jpg","subtotal":1299.0},{"shop_price":2699.0,"count":6,"pname":"中興 AXON","pimage":"products/1/c_0002.jpg","subtotal":16194.0},* {"shop_price":2298.0,"count":1,"pname":"vivo X5Pro","pimage":"products/1/c_0014.jpg","subtotal":2298.0}]*/var content="<tr id='showTableTitle'><th width='20%'>圖片</th><th width='25%'>商品</th><th width='20%'>價(jià)格</th><th width='15%'>數(shù)量</th><th width='20%'>小計(jì)</th></tr>";for(var i=0;i<data.length;++i){content+="<tr style='text-align: center;'>"+"<td>"+"<img src='${pageContext.request.contextPath }/"+data[i].pimage+"' width='70' height='60'>"+"</td>"+"<td>"+"<a target='_blank'>"+data[i].pname+"</a>"+"</td>"+"<td>"+data[i].shop_price+"</td>"+"<td>"+data[i].count+"</td>"+"<td><span class='subtotal'>"+data[i].subtotal+"</span></td>"+"</tr>";}$("#showDivTab").html(content);//訂單編號(hào) $("#shodDivOid").html(oid);},"json");}</script></HEAD><body><form id="Form1" name="Form1" action="${pageContext.request.contextPath}/user/list.jsp" method="post"><table cellSpacing="1" cellPadding="0" width="100%" align="center" bgColor="#f5fafe" border="0"><TBODY><tr><td class="ta_01" align="center" bgColor="#afd1f3"><strong>訂單列表</strong></TD></tr><tr><td class="ta_01" align="center" bgColor="#f5fafe"><table cellspacing="0" cellpadding="1" rules="all"bordercolor="gray" border="1" id="DataGrid1"style="BORDER-RIGHT: gray 1px solid; BORDER-TOP: gray 1px solid; BORDER-LEFT: gray 1px solid; WIDTH: 100%; WORD-BREAK: break-all; BORDER-BOTTOM: gray 1px solid; BORDER-COLLAPSE: collapse; BACKGROUND-COLOR: #f5fafe; WORD-WRAP: break-word"><trstyle="FONT-WEIGHT: bold; FONT-SIZE: 12pt; HEIGHT: 25px; BACKGROUND-COLOR: #afd1f3"><td align="center" width="10%">序號(hào)</td><td align="center" width="10%">訂單編號(hào)</td><td align="center" width="10%">訂單金額</td><td align="center" width="10%">收貨人</td><td align="center" width="10%">訂單狀態(tài)</td><td align="center" width="50%">訂單詳情</td></tr><c:forEach items="${orderList }" var="order" varStatus="vs"><tr onmouseover="this.style.backgroundColor = 'white'"onmouseout="this.style.backgroundColor = '#F5FAFE';"><td style="CURSOR: hand; HEIGHT: 22px" align="center"width="18%">${vs.count }</td><td style="CURSOR: hand; HEIGHT: 22px" align="center"width="17%">${order.oid }</td><td style="CURSOR: hand; HEIGHT: 22px" align="center"width="17%">${order.total }</td><td style="CURSOR: hand; HEIGHT: 22px" align="center"width="17%">${order.name }</td><td style="CURSOR: hand; HEIGHT: 22px" align="center"width="17%">${order.state==1?"已付款":"未付款" }</td><td align="center" style="HEIGHT: 22px"><input type="button" value="訂單詳情" class="clickedElement" onclick="findOrderInfoByOid('${order.oid}')"/></td></tr></c:forEach></table></td></tr></TBODY></table></form><!-- 彈出層 HaoHao added --><div id="showDiv" class="blk" style="display:none;"><div class="main"><h2>訂單編號(hào):<span id="shodDivOid" style="font-size: 13px;color: #999">123456789</span></h2><a href="javascript:void(0);" id="closeBtn" class="closeBtn">關(guān)閉</a><div id="loading" style="padding-top:30px;text-align: center;"><img alt="" src="${pageContext.request.contextPath }/images/loading4.gif" height="100px" width="100px"></div><div style="padding:20px;"><table id="showDivTab" style="width:100%"><!-- <tr id='showTableTitle'><th width='20%'>圖片</th><th width='25%'>商品</th><th width='20%'>價(jià)格</th><th width='15%'>數(shù)量</th><th width='20%'>小計(jì)</th></tr> --><%-- <tr style='text-align: center;'><td><img src='${pageContext.request.contextPath }/products/1/c_0014' width='70' height='60'></td><td><a target='_blank'>電視機(jī)</a></td><td>¥3000</td><td>3</td><td><span class='subtotal'>¥9000</span></td></tr> --%></table></div></div></div></body> </HTML>2 AdminServlet-findOrderInfoByOid代碼
// 6根據(jù)訂單oid查詢訂單項(xiàng)和商品信息 findOrderInfoByOid public void findOrderInfoByOid(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {//模擬從服務(wù)器讀數(shù)據(jù)有一個(gè)延遲的效果try {Thread.sleep(5000);} catch (InterruptedException e1) {e1.printStackTrace();}//獲得oidString oid = request.getParameter("oid");AdminService service = new AdminService();List<Map<String,Object>> mapList = null;try {mapList = service.findOrderInfoByOid(oid);} catch (SQLException e) {e.printStackTrace();}//格式轉(zhuǎn)換Gson gson = new Gson();String json = gson.toJson(mapList);//注意ajax提交回寫(xiě) System.out.println(json);/** [* {"shop_price":5999.0,"count":2,"pname":"微星(MSI)GE62 2QC-264XCN","pimage":"products/1/c_0042.jpg","subtotal":11998.0},* {"shop_price":1299.0,"count":1,"pname":"小米 4c 標(biāo)準(zhǔn)版","pimage":"products/1/c_0001.jpg","subtotal":1299.0},{"shop_price":2699.0,"count":6,"pname":"中興 AXON","pimage":"products/1/c_0002.jpg","subtotal":16194.0},* {"shop_price":2298.0,"count":1,"pname":"vivo X5Pro","pimage":"products/1/c_0014.jpg","subtotal":2298.0}]*/response.setContentType("text/html;charset=UTF-8");response.getWriter().write(json); }3 AdminService層代碼
//查詢訂單詳情 public List<Map<String, Object>> findOrderInfoByOid(String oid) throws SQLException {AdminDao dao = new AdminDao();return dao.findOrderInfoByOid(oid); }4 AdminDao代碼
//查詢訂單詳情 public List<Map<String, Object>> findOrderInfoByOid(String oid) throws SQLException {QueryRunner qr = new QueryRunner(C3P0Utils.getDataSource());String sql ="select p.pimage,p.pname,p.shop_price,i.count,i.subtotal "+ " from orderitem i,product p "+ " where i.pid=p.pid and i.oid=? ";return qr.query(sql, new MapListHandler(),oid); }5 注意
1 后臺(tái)查詢延時(shí)的模擬
2 彈出層的原理
?
轉(zhuǎn)載于:https://www.cnblogs.com/jepson6669/p/8483097.html
總結(jié)
以上是生活随笔為你收集整理的案例39-后台查询订单详情代码实现的全部?jī)?nèi)容,希望文章能夠幫你解決所遇到的問(wèn)題。
- 上一篇: bzoj 3456: 城市规划【NTT+
- 下一篇: NOI2013矩阵游戏