一、案例的概述
1、案例实现的功能
- 分类管理
查询分类
添加分类
删除分类
修改分类 - 商品管理
查询商品
根据分类查询商品
添加商品
需要选择分类信息
文件上传
删除商品
多选删除
修改商品
2、案例开发模式
MVC + 三层架构
- 表示层
jsp
servlet
filter - 业务逻辑层
service
接口
实现类 - 数据访问层
dao
接口
实现类
二、环境的搭建
- 创建新的WEB 项目
- 导入相关的jar包
mysql
dbutils
c3p0
beanutils
jstl
fileupload
jsonlib - 导入配置文件
c3p0配置文件 - 导入工具类
- 导入jQuery的js文件
-
导入css文件
环境的搭建 - 执行sql语句
create database product_manage;
use product_manage;
create table category (
cid int primary key auto_increment,
cname varchar(50) not null,
description varchar(200)
);
create table product (
pid int primary key auto_increment,
pname varchar(50) not null,
price float(8,2) not null,
path varchar(200),
pdescription varchar(200),
categoryid int,
constraint category_id_fk foreign key(categoryid) references category(cid)
);
数据库
三、开发步骤
- 创建所有的包
com.itheima.domain
com.itheima.web.servlet
com.itheima.web.filter
com.itheima.service
com.itheima.service.impl
com.itheima.dao
com.itheima.dao.impl - 创建设置编码的Filter
- 实现项目的首页
- 实现分类管理模块
添加分类
查询分类
删除分类
修改分类 - 实现商品管理模块
添加商品
查询商品
删除商品
修改商品
四、案例的准备
1、创建所有的包
包2、设置所有页面的编码
我们在监听器中讲解了一个案例,解决所有页面的乱码问题,这里不再详细讲解。
创建MyHttpServletRequest
package com.itheima.web.filter;
import java.io.UnsupportedEncodingException;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletRequestWrapper;
public class MyHttpServletRequest extends HttpServletRequestWrapper{
public MyHttpServletRequest(HttpServletRequest request) {
super(request);
// TODO Auto-generated constructor stub
}
@Override
public String getParameter(String name) {
String method = super.getMethod();
if("GET".equals(method)){
try {
String s = new String(super.getParameter(name).getBytes("ISO-8859-1"),"UTF-8");
return s;
} catch (UnsupportedEncodingException e) {
// TODO Auto-generated catch block
e.printStackTrace();
}
}
return super.getParameter(name);
}
}
创建EncodingFilter
package com.itheima.web.filter;
import java.io.IOException;
import javax.servlet.Filter;
import javax.servlet.FilterChain;
import javax.servlet.FilterConfig;
import javax.servlet.ServletException;
import javax.servlet.ServletRequest;
import javax.servlet.ServletResponse;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
public class EncodingFilter implements Filter {
public EncodingFilter() {
// TODO Auto-generated constructor stub
}
public void destroy() {
// TODO Auto-generated method stub
}
public void doFilter(ServletRequest request, ServletResponse response, FilterChain chain) throws IOException, ServletException {
MyHttpServletRequest req = new MyHttpServletRequest((HttpServletRequest) request);
HttpServletResponse res = (HttpServletResponse)response;
//设置响应的类型和编码
res.setContentType("text/html;charset=UTF-8");
//设置请求类型的编码
req.setCharacterEncoding("UTF-8");
chain.doFilter(req, res);
}
public void init(FilterConfig fConfig) throws ServletException {
// TODO Auto-generated method stub
}
}
创建一个测试页面test.jsp
<%@ 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>Insert title here</title>
</head>
<body>
<%
String username = request.getParameter("username");
out.println(username);
%>
</body>
</html>
解决乱码问题
3、实现项目的首页
<%@ 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 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>
<link rel="stylesheet" type="html/css" href="${pageContext.request.contextPath}/css/main.css">
<script type="text/javascript" src="${pageContext.request.contextPath}/js/jquery-1.8.3.min.js"></script>
</head>
<body>
<br />
<h1>商品管理系统</h1>
<br />
<a>添加分类</a>
<a>查询分类</a>
<a>添加商品</a>
<a>查询商品</a>
<br />
<hr />
<h2>欢迎使用!</h2>
</body>
</html>
首页
由于我们的所有页面上半部分相同,所以我们可以把上半部分相同的代码封装到一个header.jsp中,然后让其他的页面包含这个jsp页面。
创建header.jsp,注意页面尾部没有两个结束标签
<%@ 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 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">
<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/css/main.css" />
<script type="text/javascript" src="${pageContext.request.contextPath}/js/jquery-1.8.3.min.js"></script>
<title>商品管理系统</title>
</head>
<body>
<br />
<h1>商品管理系统</h1>
<br />
<a>添加分类</a>
<a>查询分类</a>
<a>添加商品</a>
<a>查询商品</a>
<br />
<hr />
修改index.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@ include file="/manage/header.jsp" %>
<h2>欢迎使用!</h2>
</body>
</html>
网友评论