写一个简单的小项目_写一个项目-优快云博客

本文链接：https://blog.youkuaiyun.com/qq_58461006/article/details/129529962

环境配置之前写过，在下方https://blog.youkuaiyun.com/qq_58461006/article/details/129528300?spm=1001.2014.3001.5501

1.完成任务需求：

html + Servlet +数据库的方式完成一个简单的库存商品管理系统
(1)需求描述
①管理员登录
②列出所有库存商品的名称，价格，库存数量
③可以对库存记录做增加，修改和删除
④可以按照商品名称进行查询
(2)页面参考
商品展示页面

2.创建相关数据库

3.创建相关HTML和Servlet，如下

4.登录页面

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js">
</script>
<script>
$(function(){
	$(".login").on("click",function(){
		var account=$(".account").val()
		var password=$(".password").val()
		console.log(account)
		console.log(password)
		$.ajax({
			url:"loginServlet",
			type:"post",
			async:true,
			data:{
				account:account,
				password:password
			},
			success:function(data){//查到数据后，进行登录信息判断
				if(data.data.length==1){
					alert("登陆成功")
					location.href="main.html"
				}else{
					alert("账号或密码错误，请重新输入")
				}
				//alert("成功")
				//location.href="main.html"
			},
			error:function(data){
				alert("请联系管理员")
			}
			
		})
	})
})


</script>
</head>


<body>
<div>你好</div>
账号：<input type="text" class="account"><br>
密码：<input type="text" class="password"><br>
<button class="login">登录</button>

</body>
</html>

loginServlet.java


protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
	response.setContentType("text/json;charset=utf-8");
	String account=request.getParameter("account");
	String password=request.getParameter("password");
	System.out.println("账号："+account+"，密码："+password);
	String sql="SELECT * FROM admin WHERE adminPhone=\""+account+"\" AND adminPassword=\""+password+"\"";
	String[] colums= {"adminID","adminName","adminPhone","adminPassword"};		
	String data=MysqlUtil.getJsonBySql(sql, colums);
	response.getWriter().write(data);
	System.out.println(data);
}

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

5.主页面

main.java

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>商品</title>
<script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js">
</script>
<script>
$(function(){
	$(".addc").hide()//隐藏
	$(".updatac").hide()//隐藏
	//查询所有
	$.ajax({
		url:"selectAllServlet",
		type:"get",
		async:true,
		success:function(data){
			//console.log(data)
			var temp=data.data
			console.log(temp)
			for(var i=0;i<temp.length;i++){
				$(".content").append("<tr>"+
										"<td>"+temp[i].brandName+"</td>"+
										"<td>"+temp[i].number+"</td>"+
										"<td>"+temp[i].price+"</td>"+
										"<td><input type='button' value='删除'  class='delete' index='"+temp[i].brandID+"'>"+
										"<input type='button' value='修改'  class='selectByID' index='"+temp[i].brandID+"'></td>"+
									"</tr>")
			}
		},
		error:function(){
			alert("请联系管理员")
		}
	})
	$(".addb").on("click",function(){
		$(".addc").show()//显示
	})
	//查询商品名称
	$(".search").on("click",function(){
		var name=$(".name").val()
		console.log(name)
		$.ajax({
			url:"selectByNameServlet?brandName="+name,
			type:"get",
			async:true,
			success:function(data){
				console.log(data)
				$(".content").empty()
				var temp=data.data
				for(var i=0;i<temp.length;i++){
					$(".content").append("<tr>"+
											"<td>"+temp[i].brandName+"</td>"+
											"<td>"+temp[i].number+"</td>"+
											"<td>"+temp[i].price+"</td>"+
											"<td><input type='button' value='删除'  class='delete' index='"+temp[i].brandID+"'>"+
											"<input type='button' value='修改'  class='selectByID' index='"+temp[i].brandID+"'></td>"+
										"</tr>")
				}
				
			},
			error:function(data){
				alert("请联系管理员")
			}
		})
	})
	//删除
	$(".content").on("click",".delete",function(){
		var id=$(this).attr("index")
		console.log(id)
		$.ajax({
			url:"deleteServlet",
			type:"post",
			async:true,
			data:{
				brandID:id
			},
			success:function(data){
				alert(data)
				location.reload();
			},
			error:function(data){
				alert("请联系管理员")
			}
		})
	})
	//添加
	$(".add").on("click",function(){
		var name=$(".add_name").val()
		var number=$(".add_number").val()
		var price=$(".add_price").val()
		console.log(name)
		console.log(number)
		console.log(price)
		
		$.ajax({
			url:"addServlet",
			type:"post",
			async:true,
			data:{
				brandName:name,
				number:number,
				price:price
			},
			success:function(data){
				alert(data)
				location.reload();
			},
			error:function(data){
				alert("请联系管理员")
			}
		})
	})
	//根据brandID查询——回显数据
	$(".content").on("click",".selectByID",function(){
		$(".updatac").show()
		var brandID=$(this).attr("index")//获取按钮绑定的index值
		console.log(brandID)
		$(".update").attr("index",brandID)//给按钮绑定index值
		$.ajax({
			url:"selectByIDServlet?brandID="+brandID,
			typr:"get",
			async:true,
			success:function(data){
				alert("请在下方进行修改")
				var obj=data.data
				$(".update_name").val(obj[0].brandName)
				$(".update_number").val(obj[0].number)
				$(".update_price").val(obj[0].price)
			},
			error:function(data){
				alert("请联系管理员")
			}
		})
	})
	//修改
	$(".update").on("click",function(){
		var brandID=$(this).attr("index")获取按钮绑定的index值
		var brandName=$(".update_name").val()
		var number=$(".update_number").val()
		var price=$(".update_price").val()
		console.log(brandID)
		console.log(brandName)
		console.log(number)
		console.log(price)
		$.ajax({
			url:"updateServlet",
			type:"post",
			async:true,
			data:{
				brandID:brandID,
				brandName:brandName,
				number:number,
				price:price
			},
			success:function(data){
				alert(data)
				location.reload()				
			},
			error:function(data){
				alert("请联系管理员")
			}
		})
	})
})



</script>
</head>
<body>
商品名称：<input class="name" type="text">
<input type="button" class="search" value="查找">
<input type="button" class="addb" value="添加商品"><br>
<table border="1">
	<thead>
		<tr>
			<th>商品名称</th>
			<th>数量</th>
			<th>价格</th>
			<th>操作</th>
		</tr>
		
	</thead>
	<tbody class="content">
		
	</tbody>
</table>

<div class="addc">添加：<br>
商品名称：<input type="text" class="add_name"><br>
数量：<input type="text" class="add_number"><br>
价格：<input type="text" class="add_price"><br>
<input type="button" class="add" value="添加">
</div>

<div class="updatac">修改：<br>
商品名称：<input type="text" class="update_name"><br>
数量：<input type="text" class="update_number"><br>
价格：<input type="text" class="update_price"><br>
<input type="button" class="update" value="修改">
</div>

</body>
</html>

selectAllServlet.java

protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
	response.setContentType("text/json;charset=utf-8");
	String sql="select * from brand";
	String[] colums= {"brandID","brandName","number","price"};
	String data=MysqlUtil.getJsonBySql(sql, colums);
	response.getWriter().append(data);
}

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

addServlet.java

protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
	request.setCharacterEncoding("utf-8");
	response.setCharacterEncoding("utf-8");
	String brandName=request.getParameter("brandName");
	String number=request.getParameter("number");
	String price=request.getParameter("price");
	System.out.println("商品名称："+brandName+"，数量："+number+"，价格："+price);
	String sql="INSERT INTO brand(brandName,number,price) VALUES(\""+brandName+"\","+number+","+price+")";
	int res=MysqlUtil.add(sql);
	if(res>0) {
		response.getWriter().append("添加成功");
	}else {
		response.getWriter().append("添加失败");
	}
}


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

deleteServlet.java

protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
	request.setCharacterEncoding("utf-8");
	response.setCharacterEncoding("utf-8");
	String brandID=request.getParameter("brandID");
	System.out.println(brandID);
	String sql="DELETE FROM brand WHERE brandID="+brandID;
	int res=MysqlUtil.del(sql);
	if(res>0) {
		response.getWriter().append("删除成功");
	}else {
		response.getWriter().append("删除失败");
	}
}


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

selectByNameServlet.java

protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
	response.setContentType("text/json;charset=utf-8");
	request.setCharacterEncoding("utf-8");
	response.setCharacterEncoding("utf-8");
	String brandName=request.getParameter("brandName");
	System.out.println(brandName);
	String sql="select * from brand where brandName=\""+brandName+"\"";
	String[] colums= {"brandID","brandName","number","price"};
	String data=MysqlUtil.getJsonBySql(sql, colums);
	response.getWriter().append(data);
}


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

selectByIDServlet.java

protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
	response.setContentType("text/json;charset=utf-8");
	String brandID=request.getParameter("brandID");
	System.out.println(brandID);
	String sql="select * from brand where brandID="+brandID;
	String[] colums= {"brandID","brandName","number","price"};
	String data=MysqlUtil.getJsonBySql(sql, colums);
	response.getWriter().append(data);
}


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

updateServlet.java

protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
	request.setCharacterEncoding("utf-8");
	response.setCharacterEncoding("utf-8");
	String brandID=request.getParameter("brandID");
	String brandName=request.getParameter("brandName");
	String number=request.getParameter("number");
	String price=request.getParameter("price");
	System.out.println("id:"+brandID+"，商品名称："+brandName+"，数量："+number+"，价格："+price);
	String sql="UPDATE brand SET brandName=\""+brandName+"\",number="+number+",price="+price+" WHERE brandID="+brandID;
	int res=MysqlUtil.update(sql);
	if(res>0) {
		response.getWriter().append("修改成功");
	}else {
		response.getWriter().append("修改失败");
	}
}


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