〇、写在后面
本文是【黑马程序员】用户信息列表展现案例的实际。
本文实际所需材料(jar包、页面、配置文件)下载地址为:案例材料(提取码:java)。
一、需要
用户信息的增删改查操作。
二、设计
技术选型:Servlet + JSP + MySQL + JDBCTempleat + Duird + BeanUtilS + Tomcat
数据库设计:
<code class="sql">CREATE DATABASE demo2; USE demo2; CREATE TABLE user( id INT PRIMARY KEY AUTO_INCREMENT, name VARCHAR(20) NOT NULL, gender VARCHAR(5), age INT, address VARCHAR(32), qq VARCHAR(20), email VARCHAR(50) );
应用SQLyog图形治理MySQL。
三、开发
(一)数据库环境
<code class="sql">CREATE DATABASE demo2; USE demo2; CREATE TABLE user( id INT PRIMARY KEY AUTO_INCREMENT, name VARCHAR(20) NOT NULL, gender VARCHAR(5), age INT, address VARCHAR(32), qq VARCHAR(20), email VARCHAR(50) );
(二)我的项目环境
- 在IDEA中创立JavaEE我的项目。
- 在IDEA集成配置Tomcat服务器。
- 导入jar包。
新建src/main/webapp/WEB-INF/lib
文件夹,将下载材料中的jar包
复制到lib文件夹中。
全选中后,右键 -> Add as Library
。 - 增加案例页面。
将下载材料中页面
文件夹中的所有文件、文件夹复制粘贴到本我的项目的src/main/webapp
文件夹中。
我的项目目录如下: -
批改配置文件。
将下载材料中的配置文件
中的druid.properties
复制粘贴到src/main/resources
文件夹中。批改配置文件内容(数据库名、MySQL用户名、MySQL明码):<code class="properties">driverClassName=com.mysql.jdbc.Driver url=jdbc:mysql:///demo2 username=root password=你的数据库明码 # 初始化连贯数量 initialSize=5 # 最大连接数 maxActive=10 # 最大等待时间 maxWait=3000
- 创立包。在
src/main/java/com/.../demo2
中domain、web、service、dao、util包。 - 测试。
启动Tomcat服务器,拜访http://localhost:8080/虚构门路/index.html
。(虚构门路为第二步中Tomcat配置的虚构门路。本文的虚构门路为demo2
。)
如能失常交互则我的项目环境搭建胜利。
(三)编码
domain/User.java
依据数据库设计编写User实体类。应用IDEA快捷键Alt + Insert
疾速生成结构器、Get/Set办法、toString办法。
<code class="java">package com.shadowck.demo2.domain; public class User { private int id; private String name; private String gender; private int age; private String address; private String qq; private String email; public User() { } public User(int id, String name, String gender, int age, String address, String qq, String email) { this.id = id; this.name = name; this.gender = gender; this.age = age; this.address = address; this.qq = qq; this.email = email; } public int getId() { return id; } public void setId(int id) { this.id = id; } public String getName() { return name; } public void setName(String name) { this.name = name; } public String getGender() { return gender; } public void setGender(String gender) { this.gender = gender; } public int getAge() { return age; } public void setAge(int age) { this.age = age; } public String getAddress() { return address; } public void setAddress(String address) { this.address = address; } public String getQq() { return qq; } public void setQq(String qq) { this.qq = qq; } public String getEmail() { return email; } public void setEmail(String email) { this.email = email; } @Override public String toString() { return "User{" + "id=" + id + ", name='" + name + '\'' + ", gender='" + gender + '\'' + ", age=" + age + ", address='" + address + '\'' + ", qq='" + qq + '\'' + ", email='" + email + '\'' + '}'; } }
util/JDBCUtils.java
将下载材料中配置文件
文件夹中JDBCUtils.java
的内容复制粘贴即可。
<code class="java">package com.shadowck.demo2.util; import com.alibaba.druid.pool.DruidDataSourceFactory; import javax.sql.DataSource; import javax.xml.crypto.Data; import java.io.IOException; import java.io.InputStream; import java.sql.Connection; import java.sql.SQLException; import java.util.Properties; /** * JDBC工具类 应用Durid连接池 */ public class JDBCUtils { private static DataSource ds ; static { try { //1.加载配置文件 Properties pro = new Properties(); //应用ClassLoader加载配置文件,获取字节输出流 InputStream is = JDBCUtils.class.getClassLoader().getResourceAsStream("druid.properties"); pro.load(is); //2.初始化连接池对象 ds = DruidDataSourceFactory.createDataSource(pro); } catch (IOException e) { e.printStackTrace(); } catch (Exception e) { e.printStackTrace(); } } /** * 获取连接池对象 */ public static DataSource getDataSource(){ return ds; } /** * 获取连贯Connection对象 */ public static Connection getConnection() throws SQLException { return ds.getConnection(); } }
dao/UserDAO.java
编写用户操作的DAO。
<code class="java">package com.shadowck.demo2.dao; import com.shadowck.demo2.domain.User; import java.util.List; public interface UserDAO { public List<User> findAll(); }
dao/impl/UserDAOImpl.java
<code class="java">package com.shadowck.demo2.dao.impl; import com.shadowck.demo2.dao.UserDAO; import com.shadowck.demo2.domain.User; import com.shadowck.demo2.util.JDBCUtils; import org.springframework.jdbc.core.BeanPropertyRowMapper; import org.springframework.jdbc.core.JdbcTemplate; import java.util.List; public class UserDAOImpl implements UserDAO { private JdbcTemplate template = new JdbcTemplate(JDBCUtils.getDataSource()); @Override public List<User> findAll() { //1. 定义sql String sql = "SELECT * FROM user"; List<User> users = template.query(sql, new BeanPropertyRowMapper<User>(User.class)); return users; } }
service/UserService.java
编写用户治理的业务接口。
<code class="java">package com.shadowck.demo2.service; import com.shadowck.demo2.domain.User; import java.util.List; public interface UserService { public List<User> findAll(); }
service/impl/UserServiceImpl.java
<code class="java">package com.shadowck.demo2.service.Impl; import com.shadowck.demo2.dao.UserDAO; import com.shadowck.demo2.dao.impl.UserDAOImpl; import com.shadowck.demo2.domain.User; import com.shadowck.demo2.service.UserService; import java.util.List; public class UserServiceImpl implements UserService { private UserDAO dao = new UserDAOImpl(); @Override public List<User> findAll() { //调用DAO return dao.findAll(); } }
index.jsp
将index.html
的内容复制后进行改变。留神应用EL表达式动静获取虚拟目录:${pageContext.request.contextPath}
。
<code class="jsp"><%@ page contentType="text/html;charset=UTF-8" language="java" %> <!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="utf-8"/> <meta http-equiv="X-UA-Compatible" content="IE=edge"/> <meta name="viewport" content="width=device-width, initial-scale=1"/> <title>首页</title> <!-- 1. 导入CSS的全局款式 --> <link href="css/bootstrap.min.css" rel="stylesheet"> <!-- 2. jQuery导入,倡议应用1.9以上的版本 --> <script src="js/jquery-2.1.0.min.js"></script> <!-- 3. 导入bootstrap的js文件 --> <script src="js/bootstrap.min.js"></script> <script type="text/javascript"> </script> </head> <body> <div align="center"> <a href="${pageContext.request.contextPath}/userListServlet" style="text-decoration:none;font-size:33px">查问所有用户信息 </a> </div> </body> </html>
web/servlet/UserListServlet.java
<code class="java">package com.shadowck.demo2.web.servlet; import com.shadowck.demo2.domain.User; import com.shadowck.demo2.service.Impl.UserServiceImpl; import javax.servlet.ServletException; import javax.servlet.annotation.WebServlet; import javax.servlet.http.HttpServlet; import javax.servlet.http.HttpServletRequest; import javax.servlet.http.HttpServletResponse; import java.io.IOException; import java.util.List; @WebServlet("/userListServlet") public class UserListServlet extends HttpServlet { @Override protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException { //1. 调用userService实现查问。 UserServiceImpl service = new UserServiceImpl(); List<User> users = service.findAll(); //2. 将List存入request域 req.setAttribute("user", users); //3. 转发到list.jsp req.getRequestDispatcher("/list.jsp").forward(req, resp); } @Override protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException { this.doPost(req, resp); } }
list.jsp
<code class="jsp"><%@ page contentType="text/html;charset=UTF-8" language="java" %> <%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %> <!DOCTYPE html> <!-- 网页应用的语言 --> <html lang="zh-CN"> <head> <!-- 指定字符集 --> <meta charset="utf-8"> <!-- 应用Edge最新的浏览器的渲染形式 --> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <!-- viewport视口:网页能够依据设置的宽度主动进行适配,在浏览器的外部虚构一个容器,容器的宽度与设施的宽度雷同。 width: 默认宽度与设施的宽度雷同 initial-scale: 初始的缩放比,为1:1 --> <meta name="viewport" content="width=device-width, initial-scale=1"> <!-- 上述3个meta标签*必须*放在最后面,任何其余内容都*必须*追随其后! --> <title>用户信息管理系统</title> <!-- 1. 导入CSS的全局款式 --> <link href="css/bootstrap.min.css" rel="stylesheet"> <!-- 2. jQuery导入,倡议应用1.9以上的版本 --> <script src="js/jquery-2.1.0.min.js"></script> <!-- 3. 导入bootstrap的js文件 --> <script src="js/bootstrap.min.js"></script> <style type="text/css"> td, th { text-align: center; } </style> </head> <body> <div class="container"> <h3 style="text-align: center">用户信息列表</h3> <table border="1" class="table table-bordered table-hover"> <tr class="success"> <th>编号</th> <th>姓名</th> <th>性别</th> <th>年龄</th> <th>籍贯</th> <th>QQ</th> <th>邮箱</th> <th>操作</th> </tr> <c:forEach items="${users}" var="user" varStatus="s"> <tr> <td>${s.count}</td> <td>${user.name}</td> <td>${user.gender}</td> <td>${user.age}</td> <td>${user.address}</td> <td>${user.qq}</td> <td>${user.email}</td> <td><a class="btn btn-default btn-sm" href="update.html">批改</a> <a class="btn btn-default btn-sm" href="">删除</a></td> </tr> </c:forEach> <tr> <td colspan="8" align="center"><a class="btn btn-primary" href="add.html">增加联系人</a></td> </tr> </table> </div> </body> </html>