购物车项目+EL表达式+JSTL+数据库

2022-11-18 20:48:30 浏览数 (1)

上一期有网友说有点看不懂,我这次就写仔细一点,希望大家不要觉得太多而没耐心,thanks! 页面效果以及代码字后面,红色的是大标题

什么是EL表达式

什么是EL:EL即Expression Language(表达式语言)

EL的功能:替代JSP页面中的复杂代码

EL的语法:${  EL exprission }

                ${ bean.name } 或 ${ bean['name'] }

EL的特点

自动转换类型:EL得到某个数据时可以自动转换类型,对于类型的限制更加宽松,使用简单,相比较在JSP中嵌入Java代码,EL应用更简单

EL的语法

EL语法:

        以“${”作为开始,以“}”作为结束

        直接使用变量名获取值$

        ${  username }

        变量属性范围名称

属性范围

EL中的名称

page

pageScope,例如${pageScope.username},表示在page范围内查找username变量,找不到返回Null

request

requstScope

session

sessionScope

application

applicationScope

EL中的运算符

EL运算符 :运算符”[ ]” 运算符”.”

作用: 获取对象属性

获取对象集合中的数据: 在Session中保存了一个(list)集合users

 EL表达式的简单应用:先给大家演示一下简单的代码效果

 EL隐式对象

EL隐式对象介绍

对象名称

说  明

pageScope

返回页面范围的变量名,这些名称已映射至相应的值

requestScope

返回请求范围的变量名,这些名称已映射至相应的值

sessionScope

返回会话范围的变量名,这些名称已映射至相应的值

applicationScope

返回应用范围内的变量,并将变量名映射至相应的值

param

返回客户端的请求参数的字符串值

paramValues

返回映射至客户端的请求参数的一组值

pageContext

提供对用户请求和页面信息的访问




什么是JSTL

什么是JSTL :JSTL(JavaServerPages Standard Tag Library)

                        JSP标准标签库

                        JSTL通常会与EL表达式合作实现JSP页面的编码

                        使用JSTL实现JSP页面中逻辑处理

JSTL的优点:

                       提供一组标准标签 

                       可用于编写各种动态JSP页面

为什么使用JSTL?

虽然EL表达式可以访问JavaBean的属性,但是并不能实现在JSP中进行逻辑判断,因而要使用JSTL标签。

JSTL的环境搭建

使用JSTL的步骤:

在JSP页面添加taglib指令

                使用JSTL标签

JSTL标准标签库介绍

 通用标签的使用:

         set:设置指定范围内的变量值

         out:计算表达式并将结果输出显示

         remove:删除指定范围内的变量

 条件标签

条件标签的使用:

         if:if标签用于判断条件是否成立,与Java中的If语句作用相同

语法:

迭代标签 :实现对集合中对象的遍历

语法:




 以上所写的知识就是下面购物车项目要运用到的知识点

下面这张图就是购物车版本以及现在给你们介绍的就是gwc3里面用到了css、js、fonts

 这个购物车我改了字段,在下面列出来了

用户表user:int uuid-编号,String uname-名字,String upwd-密码,String uinfo-备注,这里面有两个方法

商品表goods: int bid-编号,String bname-名称,double bprice-价格,String binfo-简介,String bface-图片,你们需要哪些方法就写那些

订单表orderitem: int oid-订单标号,int uuid-用户编号,int bid-商品编号,String bname-商品名称,double bprice-商品价格,String binfo-商品简介,String bface-商品图片,int gnumber-订单数量,double gprice-订单总价,方法依据自己的想法

下面就是代码了

首先是登录页面login.jsp和dologin.jsp注册页面register.jsp和doregister.jsp

其次是主页面index.jsp和doindex.jsp

第三是购物车页面gwc.jsp和dogwc.jsp

第四是一些其他的小页面

最后是支付页面sfk.jsp

login.jsp

代码语言:javascript复制
<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>用户登录</title>
<style>
 #a {
    width:50%;
    height:200px;
    border: 1px dashed ;
    background-color:lightyellow;
    text-align:center;
}
body{
background-color:lightblue;
}
</style>
<script type="text/javascript">
	var str = "qwertyupasdfghjkzxcvbnmQWERTYUPASDFGHJKLZXCVBNM23456789";
	function yz() {
		//随机出4个0-字符串长度之间的数字 做为下标
		yzmStr="";
		for(var i=1;i<=4;i  ){
			yzmStr =str.substr(Math.round(Math.random()*(str.length-1)),1);
		}
		//把验证码赋值到页面
		document.getElementById("syzm").innerHTML=yzmStr;
	}
	
	
	function $(id) {
		return document.getElementById(id);
	}
	
	function login_yz() {
		//验证 用户名 和 密码不能为空 
		//获取用户名
		var uname = $("uname").value;	
		if(uname.length==0){
			alert("用户名不能为空");
			return false;
		}
		//获取密码
		var upwd = $("upwd").value;
		if(upwd.length==0){
			alert("密码不能为空");
			return false;
		}
		
		//获取验证码:判断和电脑的验证码是否相等
		//PS:自己实现-输入的验证码不区分大小写-大小写转换
		var yzm = $("uyzm").value;
		if(yzm!=yzmStr){
			alert("验证码输入错误,请重新输入");
			//清空输入的验证码
			$("uyzm").value="";
			//重新生成验证码
			yz();
			return false;
		}
	}
</script>
</head>
<body onload="yz()" >
	<div id="login" align="center">
		<div id="center">
			<div id="center_left"></div>
			<div id="center_middle">
			<form action="dologin.jsp" onsubmit="return login_yz()">
				<div id="user">
					用 户 <input type="text" id="uname" name="textfield" />
				</div>
				<div id="password">
					密 码 <input type="password" id="upwd" name="textfield2" />
				</div>
				<div id="yzm">
					验证码 <input id="uyzm" style="width: 50px;" type="text" name="textfield3" />
					<span id="syzm" onclick="yz()"></span>
				</div>
				<div id="btn">
					<input type="submit" value="登录">
					<input type="button" value="注册" onclick="javascript:location.href='register.jsp'">
				</div>
			</form>
			</div>
			<div id="center_right"></div>
		</div>
	</div>
</body>
</html>

dologin.jsp

代码语言:javascript复制
<%@page import="com.zking.entity.User"%>
<%@page import="com.zking.biz.imp.Imp_Userbiz"%>
<%@page import="com.zking.biz.IUserbiz"%>
<%@page import="java.sql.ResultSet"%>
<%@page import="java.sql.PreparedStatement"%>
<%@page import="java.sql.DriverManager"%>
<%@page import="java.sql.Connection"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%
	//乱码
	request.setCharacterEncoding("utf-8");
	String uname = request.getParameter("textfield");
	String jks=request.getParameter("jk");
	int jk=0;
	String upwd = request.getParameter("textfield2");
	IUserbiz iub=new Imp_Userbiz();
	User T=iub.login(uname, upwd);
	if(T!=null){//成功就跳转到主页面
			session.setAttribute("a", T.getUuid());
			request.getRequestDispatcher("doindex.jsp").forward(request, response);
	}else{//错误就回到登录页面
			out.print("<script>alert('用户名或密码错误,请重新登录');location.href='login.jsp'</script>");
		}
%>

register.jsp

代码语言:javascript复制
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>用户注册</title>
<style>
 #a {
    width:50%;
    height:200px;
    border: 1px dashed ;
    background-color:lightyellow;
    text-align:center;
}
body{
background-color:lightblue;
}
</style>
</head>
<body>
	<form action="doregister.jsp" method="post" align="center">
		用户名:<input type="text" name="uname"><br>
		密码:<input type="password" name="upwd"><br>
		备注:<textarea rows="" cols="" name="uinfo">
		</textarea><br>
		<input type="submit" value="注册">
		<input type="reset" value="重置">
	</form>
</body>
</html>

doregister.jsp

代码语言:javascript复制
<%@page import="com.zking.biz.imp.Imp_Userbiz"%>
<%@page import="com.zking.biz.IUserbiz"%>
<%@page import="com.zking.entity.User"%>
<%@page import="java.sql.ResultSet"%>
<%@page import="java.sql.PreparedStatement"%>
<%@page import="java.sql.DriverManager"%>
<%@page import="java.sql.Connection"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%
	//设置编码-设置请求对象的编号
	request.setCharacterEncoding("utf-8");
	//接收注册页面传递的数据
	String uname = request.getParameter("textfield");
	String upwd = request.getParameter("textfield2");
	String uinfo = request.getParameter("uinfo");
	IUserbiz df=new Imp_Userbiz();
	User T=new User(uname,upwd,uinfo);
	//执行sql语句
	if(T!=null){//成功就跳转到主页面
			session.setAttribute("a", T.getUuid());
			request.getRequestDispatcher("login.jsp").forward(request, response);
	}else{//错误就回到登录页面
			out.print("<script>alert('用户名或密码错误,请重新登录');location.href='register.jsp'</script>");
		}
%>

index.jsp

代码语言:javascript复制
<%@page import="com.zking.util.DBHelper"%>
<%@page import="com.zking.entity.OrderItem"%>
<%@page import="com.zking.biz.imp.Imp_orderItembiz"%>
<%@page import="com.zking.biz.IorderItembiz"%>
<%@page import="com.zking.biz.imp.Imp_Goodsbiz"%>
<%@page import="com.zking.dao.imp.Imp_GoodsDao"%>
<%@page import="com.zking.biz.IGoodsbiz"%>
<%@page import="com.zking.entity.Goods"%>
<%@page import="java.util.ArrayList"%>
<%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
    <%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Insert title here</title>
<script type="text/javascript" src="js/jquery-3.3.1.js"></script>
<script type="text/javascript" src="js/bootstrap.js"></script>
<link rel="stylesheet" type="text/css" href="css/bootstrap.min.css"/>
<script type="text/javascript">
	function gm(bid){
		location.href="dogwc.jsp?bid=" bid;
	}
</script>
</head>
<body>
	<table class="table table-hover">
		<tr>
			<td>商品编号</td>
			<td>商品名称</td>
			<td>商品单价</td>
			<td>商品介绍</td>
			<td>商品图片</td>
			<td>操作一下</td>	
		</tr>
		<c:forEach items="${glist }" var="g">
		<tr>
			<td>${g.bid }</td>
			<td>${g.bname }</td>
			<td>${g.bprice }</td>
			<td>${g.binfo }</td>
			<td>
			<img src="${g.bface }">
			</td>
			<td>
			<button onclick="gm(${g.bid })" class="btn btn-success">添加到购物车</button>
			</td>
		</tr>
	</c:forEach>
	</table>
</body>
</html>

doindex.jsp

代码语言:javascript复制
<%@page import="com.zking.biz.imp.Imp_Goodsbiz"%>
<%@page import="com.zking.entity.Goods"%>
<%@page import="java.util.ArrayList"%>
<%@page import="com.zking.biz.IGoodsbiz"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%
IGoodsbiz igb=new Imp_Goodsbiz();
ArrayList<Goods> glist=igb.getAll();
request.setAttribute("glist", glist);
request.getRequestDispatcher("index.jsp").forward(request, response);
%>

gwc.jsp

代码语言:javascript复制
<%@page import="com.zking.dao.IorderItemDao"%>
<%@page import="com.zking.biz.imp.Imp_orderItembiz"%>
<%@page import="com.zking.biz.IorderItembiz"%>
<%@page import="com.zking.entity.OrderItem"%>
<%@page import="java.util.ArrayList"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
    <%@  taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script type="text/javascript" src="js/jquery-3.3.1.js"></script>
<script type="text/javascript" src="js/bootstrap.js"></script>
<link rel="stylesheet" type="text/css" href="css/bootstrap.min.css"/>
<script type="text/javascript">
function xx() {
	//跳转到支付页面
	location.href="sfk.jsp";
}
function $(id) {
	return document.getElementById(id);
}
function xg(obj,bid){
	var gnumber=obj.value;
	//alert(gnumber);
	location.href="dogwc.jsp?bid=" bid "&gn=" gnumber;
}
function bbb(oid,a){
	if(a=='-'){
		var gnumber=parseInt($("text").value)-1;
		if(gnumber==0){
			location.href="sc.jsp?bid=" bid;
		}else{
		location.href="doxg.jsp?oid=" oid "&aa=" 1;
		}
	}else if(a==' '){
		location.href="doxg.jsp?oid=" oid "&aa=" 2;
	}	
}
function sc(oid){
	location.href="sc.jsp?oid=" oid;
}
</script>
</head>
<body>
<table class="table table-hover">
<tr>
	<td>商品名称</td>
	<td>商品单价</td>
	<td>商品信息</td>
	<td>商品图片</td>
	<td>商品数量</td>
	<td>总价</td>
	<td>操作一下</td>
</tr>


<c:forEach items="${oslist }" var="d">
<tr>
	<td>${d.bname}</td>
	<td>${d.bprice}</td>
	<td>${d.binfo }</td>
	<td>
	<img src="${d.bface} ">
	</td>
	<td>
	<button class="btn" onclick="bbb(${d.oid },' ')"> </button>
	<input id="text"  type="text" style="width:40px;text-align:center" value="${d.gnumber } "/>
	<button class="btn" onclick="bbb(${d.oid },'-')">-</button>
	</td>
	<td>${d.gprice }</td>
	<td>
		<button onclick="sc(${d.oid })" class="btn btn-danger">删除</button>
	</td>
</tr>

				<c:set var="sum" value="${sum d.gprice}"></c:set>
		</c:forEach>
</table>
<button class="btn btn-success" onclick="xx()">总价${sum }</button>&nbsp&nbsp&nbsp&nbsp
<a href="doindex.jsp">返回首页</a>
</body>
</html>

dogwc.jsp

代码语言:javascript复制
<%@page import="org.eclipse.jdt.internal.compiler.batch.Main"%>
<%@page import="com.zking.biz.imp.Imp_orderItembiz"%>
<%@page import="com.zking.biz.IorderItembiz"%>
<%@page import="com.zking.util.DBHelper"%>
<%@page import="com.zking.entity.Goods"%>
<%@page import="org.apache.catalina.util.Introspection"%>
<%@page import="com.zking.biz.imp.Imp_Goodsbiz"%>
<%@page import="com.zking.biz.IGoodsbiz"%>
<%@page import="com.zking.entity.OrderItem"%>
<%@page import="java.util.ArrayList"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%
String number=request.getParameter("gn");
//System.out.print(number);
int count=1;
if(number!=null){
	count=Integer.valueOf(number);
}
String uid=session.getAttribute("a") "";
int uuid=Integer.valueOf(uid);
String id=request.getParameter("bid");
int bid=Integer.valueOf(id);
//创建订单对象
OrderItem d=new OrderItem();
//使用多态创建商品业务逻辑层和实现类
IGoodsbiz igb=new Imp_Goodsbiz();
IorderItembiz iot=new Imp_orderItembiz();
Goods gd=new Goods();
gd=igb.getById(bid);
int oid=DBHelper.getNextId("OrderItem", "oid");
d.setOid(oid);
d.setUuid(uuid);
d.setBid(bid);
d.setBname(gd.getBname());

d.setBprice(gd.getBprice());
d.setBinfo(gd.getBinfo());
d.setBface(gd.getBface());
d.setGnumber(1);
int gnumber=1;
double bprice=gd.getBprice();
double sumgprice=gnumber*bprice;
d.setGprice(sumgprice);
ArrayList<OrderItem> slist=iot.getAll(uuid);
	boolean b=true;
	for(int i=0;i<slist.size();i  ){
		int ordid=slist.get(i).getOid();
		int orprice=(int)slist.get(i).getBprice();
		if(bid==slist.get(i).getBid()){
				//int price=(int)slist.get(i).getBprice();
			if(number==null){
				int num=slist.get(i).getGnumber() 1;
				iot.updateByOid(ordid, num);
				iot.updateprice(ordid, num, orprice);
				//System.out.print(slist.get(i).getGnumber());
			}else{
				iot.updateByOid(ordid, count);
				iot.updateprice(ordid, count, orprice);
			}
			b=false;
		}
	}
	if(b){	
	iot.add(d);
	}
response.sendRedirect("doshopping.jsp?number=" number);

%>

doshopping.jsp

代码语言:javascript复制
<%@page import="com.zking.entity.OrderItem"%>
<%@page import="java.util.ArrayList"%>
<%@page import="com.zking.biz.imp.Imp_orderItembiz"%>
<%@page import="com.zking.biz.IorderItembiz"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<% 
String uid=session.getAttribute("a") "";
int uuid=Integer.valueOf(uid);
IorderItembiz iot=new Imp_orderItembiz();
ArrayList<OrderItem> oslist=iot.getAll(uuid);
request.setAttribute("oslist", oslist);
System.out.print(uuid);
System.out.print(oslist);
request.getRequestDispatcher("gwc.jsp").forward(request, response);
%>

doxg.jsp

代码语言:javascript复制
<%@page import="com.zking.entity.OrderItem"%>
<%@page import="com.zking.biz.imp.Imp_orderItembiz"%>
<%@page import="com.zking.biz.IorderItembiz"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<% 

String y=request.getParameter("aa");
int ys=Integer.valueOf(y);
String id=request.getParameter("oid");
int oid=Integer.valueOf(id);
IorderItembiz iob=new Imp_orderItembiz();
OrderItem oi= iob.getById(oid);
int number=oi.getGnumber();
if(ys==2){
	int num=number 1;
	iob.updateByOid(oid, num);
}else if(ys==1){
	int num=number-1;
	//System.out.print(num);
	iob.updateByOid(oid, num);
}
response.sendRedirect("doshopping.jsp");

%>

sc.jsp

代码语言:javascript复制
<%@page import="com.zking.biz.imp.Imp_orderItembiz"%>
<%@page import="com.zking.biz.IorderItembiz"%>
<%@page import="com.zking.entity.OrderItem"%>
<%@page import="java.util.ArrayList"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<% 
String uid=session.getAttribute("a") "";
int uuid=Integer.valueOf(uid);
IorderItembiz idb=new Imp_orderItembiz();
String id= request.getParameter("oid");
int oid=Integer.valueOf(id);
idb.deleteById(oid);
response.sendRedirect("doshopping.jsp");

%>

sfk.jsp

代码语言:javascript复制
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body align="center">
	<img alt="" src="images/gr.png" >
	<a href="doindex.jsp">返回首页</a>
</body>
</html>

下期再见

0 人点赞