簡單的jsp+servlet+jdbc+mysql實現用戶增刪改查-一抹茶-csdn

jsp+servlet+jdbc+mysql實現用戶增刪改查

項目下載地址…裏面包含了項目文件,jar,bootstrap,jquery,sql
也可以聯繫957406675 QQ羣獲取下載

1. 運行環境
   .jdk1.8.0_102
   .eclipse Neon.2 Release (4.6.2)
   .Tomcat 8.0.52
   .mysql 5 7

2. 項目準備
   .創建web項目
   
   
   .架包
   
   .目錄結構
   
   .數據庫創建
   
   user表
   
   .連接數據庫的工具類DBUtils.java

package com.zsx.utils;

import java.io.FileReader;
import java.io.Reader;
import java.sql.Connection;
import java.sql.DriverManager;
import java.util.Properties;

public class DBUtils {
	private static String driver;
	private static String url;
	private static String user;
	private static String password;

	static Connection conn = null;

	static {
		Properties properties = new Properties(); // 創建一個properties對象
		Reader inReader; // 一個reader屬性;

		try {
			String path = Thread.currentThread().getContextClassLoader().getResource("jdbc.properties").getPath();
			inReader = new FileReader(path); // 用這個方法獲取properties配置文件;
			properties.load(inReader); // 加載load內部的地址;
		} catch (Exception e) {
			// TODO Auto-generated catch block
			e.printStackTrace();
		}

		// 通過properties.getProperty("driver");方法獲取值
		driver = properties.getProperty("driver");
		url = properties.getProperty("url");
		user = properties.getProperty("user");
		password = properties.getProperty("password");
	}

	/**
	 * 打開數據庫連接
	 * 
	 * @return
	 */
	public static Connection open() {
		try {
			Class.forName(driver);
			System.out.println("連接成功......");
			return DriverManager.getConnection(url, user, password);
		} catch (Exception e) {
			System.out.println("連接數據庫失敗....");
		}
		return null;
	}

	/**
	 * 關閉數據庫連接
	 * 
	 * @return
	 */
	public static Connection close() {
		if (conn != null) {
			try {
				conn.close();// 關閉數據庫
				System.out.println("關閉...");
			} catch (Exception e) {
				e.printStackTrace();
				System.out.println("數據庫關閉失敗...");
			}
		}
		return null;
	}
}

需要在src下新建一個 jdbc.properties

內容如下,
.driver:驅動
.url:數據庫的地址jdbc:mysql://localhost:3306/+這裏數據庫名?字符集
.user:數據庫用戶名
.password:數據庫密碼

 driver=com.mysql.jdbc.Driver
 url=jdbc:mysql://localhost:3306/jspdemo?useUnicode=true&characterEncoding=utf8
 user=root 
 password=root

3. 進入主題
   實體類User.java

package com.zsx.bean;

public class User {
	private Integer id;
	private String userName;
	private String password;

	public User(Integer id, String userName, String passwrod) {
		super();
		this.id = id;
		this.userName = userName;
		this.password = passwrod;
	}

	public User() {
		super();
		// TODO Auto-generated constructor stub
	}

	public Integer getId() {
		return id;
	}

	public void setId(Integer id) {
		this.id = id;
	}

	public String getUserName() {
		return userName;
	}

	public void setUserName(String userName) {
		this.userName = userName;
	}

	public String getPasswrod() {
		return password;
	}

	public void setPasswrod(String passwrod) {
		this.password = passwrod;
	}

}

.servlet 編寫
添加
AddServlet.java

package com.zsx.servlet;

import java.io.IOException;
import java.sql.Connection;
import java.sql.PreparedStatement;

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 com.zsx.utils.DBUtils;

/**
 * Servlet implementation class LoginServlet
 */
@WebServlet("/addServlet")
public class AddServlet extends HttpServlet {
	private static final long serialVersionUID = 1L;

	/**
	 * 添加數據
	 * 
	 * @see HttpServlet#doGet(HttpServletRequest request, HttpServletResponse
	 *      response)
	 */
	protected void doGet(HttpServletRequest request, HttpServletResponse response)
			throws ServletException, IOException {
		String username = request.getParameter("username");
		String password = request.getParameter("password");
		if (username != null && password != null) {
			Connection conn = DBUtils.open(); /// 獲得數據庫連接
			String sql = "insert into user(user_name, password) values(?,?);";

			try {
				PreparedStatement prtmt = conn.prepareStatement(sql); // 預編譯
				prtmt.setString(1, username); // 給第一個? 傳值
				prtmt.setString(2, password); // 給第二個? 傳值
				int resInt = prtmt.executeUpdate(); // 如果添加成功返回影響數
				request.setAttribute("resInt", resInt);
				request.getRequestDispatcher("/findAllServlet").forward(request, response);
			} catch (Exception e) {
				// TODO Auto-generated catch block
				e.printStackTrace();
			} finally {
				DBUtils.close(); // 關閉數據庫連接
			}
		}

	}

	/**
	 * @see HttpServlet#doPost(HttpServletRequest request, HttpServletResponse
	 *      response)
	 */
	protected void doPost(HttpServletRequest request, HttpServletResponse response)
			throws ServletException, IOException {
		request.setCharacterEncoding("utf-8");
		response.setContentType("text/html;charset=utf-8");
		doGet(request, response);
	}

}

DelServlet.java

package com.zsx.servlet;

import java.io.IOException;
import java.sql.Connection;
import java.sql.PreparedStatement;
import java.sql.SQLException;

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 com.zsx.utils.DBUtils;

/**
 * Servlet implementation class DelServlet
 */
@WebServlet("/DelServlet")
public class DelServlet extends HttpServlet {
	private static final long serialVersionUID = 1L;

	/**
	 * 刪除數據
	 * 
	 * @see HttpServlet#doGet(HttpServletRequest request, HttpServletResponse
	 *      response)
	 */
	protected void doGet(HttpServletRequest request, HttpServletResponse response)
			throws ServletException, IOException {
		String id = request.getParameter("id"); // 傳入id;
		if (id != null) {
			Connection conn = DBUtils.open();// 獲得數據連接
			String sql = "delete from user where id = ?";
			try {
				PreparedStatement prtmt = conn.prepareStatement(sql); // 預編譯

				prtmt.setString(1, id); // 給id賦值
				int resInt = prtmt.executeUpdate(); // 執行sql返回影響行數;
				request.setAttribute("resInt", resInt);
				request.getRequestDispatcher("/findAllServlet").forward(request, response);
			} catch (SQLException e) {
				// TODO Auto-generated catch block
				e.printStackTrace();
			} finally {
				DBUtils.close(); // 關閉數據庫連接
			}

		}

	}

	/**
	 * @see HttpServlet#doPost(HttpServletRequest request, HttpServletResponse
	 *      response)
	 */
	protected void doPost(HttpServletRequest request, HttpServletResponse response)
			throws ServletException, IOException {
		request.setCharacterEncoding("utf-8");
		response.setContentType("text/html;charset=utf-8");
		doGet(request, response);
	}

}

UpdateServlet.java

package com.zsx.servlet;

import java.io.IOException;
import java.sql.Connection;

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.sql.PreparedStatement;
import java.sql.SQLException;

import com.zsx.utils.DBUtils;

/**
 * Servlet implementation class UpdateServlet
 */
@WebServlet("/UpdateServlet")
public class UpdateServlet extends HttpServlet {
	private static final long serialVersionUID = 1L;

	/**
	 * 更新數據
	 * 
	 * @see HttpServlet#doGet(HttpServletRequest request, HttpServletResponse
	 *      response)
	 */
	protected void doGet(HttpServletRequest request, HttpServletResponse response)
			throws ServletException, IOException {
		String id = request.getParameter("id");
		String username = request.getParameter("username");
		String password = request.getParameter("password");
		if (id != null && username != null || password != null) {
			// 獲得數據庫連接
			Connection conn = DBUtils.open();
			String sql = "update user set user_name=?,password=? where id=?"; // sql語句

			try {
				PreparedStatement prtmt = conn.prepareStatement(sql); // 預編譯語句

				prtmt.setString(1, username); // 給第一個? 添加數據
				prtmt.setString(2, password); // 給第二個? 添加數據
				prtmt.setString(3, id); // 給第三個? 添加數據

				int resInt = prtmt.executeUpdate(); // 執行
				request.setAttribute("resInt", resInt); // 返回影響的行數
				request.getRequestDispatcher("/findAllServlet").forward(request, response);
			} catch (SQLException e) {
				// TODO Auto-generated catch block
				e.printStackTrace();
			} finally {
				DBUtils.close(); // 關閉數據庫連接
			}
		}

	}

	/**
	 * @see HttpServlet#doPost(HttpServletRequest request, HttpServletResponse
	 *      response)
	 */
	protected void doPost(HttpServletRequest request, HttpServletResponse response)
			throws ServletException, IOException {
		request.setCharacterEncoding("utf-8");
		response.setContentType("text/html;charset=utf-8");
		doGet(request, response);
	}

}

FindAllServlet.java

package com.zsx.servlet;

import java.io.IOException;
import java.sql.Connection;
import java.sql.PreparedStatement;
import java.sql.ResultSet;
import java.sql.SQLException;
import java.util.ArrayList;
import java.util.HashMap;
import java.util.List;
import java.util.Map;

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 com.zsx.bean.User;
import com.zsx.utils.DBUtils;

/**
 * Servlet implementation class FindAllServlet
 */
@WebServlet("/findAllServlet")
public class FindAllServlet extends HttpServlet {
	private static final long serialVersionUID = 1L;

	/**
	 * 查詢所有用戶
	 * 
	 * @see HttpServlet#doGet(HttpServletRequest request, HttpServletResponse
	 *      response)
	 */
	protected void doGet(HttpServletRequest request, HttpServletResponse response)
			throws ServletException, IOException {
		List<User> userList = new ArrayList<User>(); // 創建一個list集合,用於裝user集合
		Connection conn = DBUtils.open(); // 打開數據庫連接
		String sql = " select id,user_name,password from user ;";

		try {
			PreparedStatement prtmt = conn.prepareStatement(sql);
			ResultSet rs = prtmt.executeQuery();

			while (rs.next()) {
				int id = rs.getInt("id");
				String username = rs.getString("user_name");
				String password = rs.getString("password");
				User user = new User(); /// 實例化user
				user.setId(id);
				user.setUserName(username);
				user.setPasswrod(password);
				userList.add(user);
			}
			request.setAttribute("userList", userList);
			request.getRequestDispatcher("/user_list.jsp").forward(request, response);
		} catch (SQLException e) {
			// TODO Auto-generated catch block
			e.printStackTrace();
		} finally {
			DBUtils.close(); // 關閉數據庫連接
		}
	}

	/**
	 * @see HttpServlet#doPost(HttpServletRequest request, HttpServletResponse
	 *      response)
	 */
	protected void doPost(HttpServletRequest request, HttpServletResponse response)
			throws ServletException, IOException {
		request.setCharacterEncoding("utf-8");
		response.setContentType("text/html;charset=utf-8");
		doGet(request, response);
	}

}

.前端頁面

用了bootstrap前端框架美化界面,在使用bootstrap之前需要引入jquery框架,在後面我會細說

bootstrap下載地址…

jquery下載地址…

將兩個插件引入項目

將下載來的bootstrap拷貝到WebContext下如上圖
將jquery-1.11.1.js放入js文件夾下

.編寫歡迎頁面
index.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>歡迎頁面</title>
</head>
<body>
	<center>
		<h1>
			<a href="findAllServlet">用戶信息</a>
		</h1>
	</center>
</body>
</html>

user_list.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%
	String path = request.getContextPath();
%>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script src="<%=path%>/resource/bs/js/jquery-1.11.1.js"></script>	<!-- 引入jquery -->
<link rel="stylesheet" href="<%=path%>/resource/bs/css/bootstrap.css"> <!-- 引入bootstrap.css -->
<script src="<%=path%>/resource/bs/js/bootstrap.min.js"></script><!-- 引入bootstrap.min.js -->
<title>用戶列表</title>
</head>
<body>
	<section class="container">
		<div class="row">
			<div class="col-md-3">
				<button class="btn btn-danger" data-toggle="modal"
					data-target="#addModal">新增</button>
			</div>

		</div>
		<table class="table table-striped table-bordered table-hover">
			<th>ID</th>
			<th>用戶名</th>
			<th>密碼</th>
			<th>操作</th>
			<c:forEach items="${ userList }" var="list">
				<tr>
					<td>${list.id }</td>
					<td>${list.userName }</td>
					<td>${list.passwrod }</td>
					<td colspan="2"><button class="btn btn-primary edBtn"
							data-toggle="modal" data-target="#edModal" value="${list.id }" n="${ list.userName}" p="${list.passwrod }">編輯</button>
						<button class="btn btn-danger delBtn" data-toggle="modal"
							data-target=".delModal" value="${list.id }">刪除</button></td>
				</tr>
			</c:forEach>
		</table>
	</section>
</body>

<div class="modal fade delModal" tabindex="-1" role="dialog"
	aria-labelledby="gridSystemModalLabel">
	<div class="modal-dialog" role="document">
		<div class="modal-content">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal"
					aria-label="Close">
					<span aria-hidden="true">&times;</span>
				</button>
				<h4 class="modal-title" id="gridSystemModalLabel">提示</h4>
			</div>
			<div class="modal-body">
				<h4>真的不要了嗎?</h4>
			</div>
			<div class="modal-footer">
				<form action="DelServlet">
					<input id="delid" name="id" value="" hidden>
					<button type="button" class="btn btn-primary" data-dismiss="modal">留着</button>
					<button type="submit" class="btn btn-danger">刪了</button>
				</form>
			</div>
		</div>
		<!-- /.modal-content -->
	</div>
	<!-- /.modal-dialog -->
</div>
<!-- /.modal -->

<!-- 編輯模態框 -->
<div class="modal fade" id="edModal" tabindex="-1" role="dialog"
	aria-labelledby="edModal">
	<div class="modal-dialog" role="document">
		<div class="modal-content">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal"
					aria-label="Close">
					<span aria-hidden="true">&times;</span>
				</button>
				<h4 class="modal-title" id="exampleModalLabel">用戶信息</h4>
			</div>
			<form action="UpdateServlet" method="post">
				<div class="modal-body">
					<input id="edId" name="id" value="" hidden>
					<div class="form-group">
						<label for="username" class="control-label">用戶名:</label> <input
							type="text" name="username" class="form-control" id="username"
							value="${user.userName }" required>
					</div>
					<div class="form-group">
						<label for="password" class="control-label">密 碼:</label> <input
							type="password" name="password" class="form-control" id="password"
							value="${user.password }" required>
					</div>

				</div>
				<div class="modal-footer">
					<button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
					<button type="submit" class="btn btn-primary">更新</button>
				</div>
			</form>
		</div>
	</div>
</div>

<!-- 添加模態框 -->
<div class="modal fade" id="addModal" tabindex="-1" role="dialog"
	aria-labelledby="edModal">
	<div class="modal-dialog" role="document">
		<div class="modal-content">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal"
					aria-label="Close">
					<span aria-hidden="true">&times;</span>
				</button>
				<h4 class="modal-title" id="exampleModalLabel">用戶信息</h4>
			</div>
			<form action="addServlet" method="post">
				<div class="modal-body">
					<input id="edId" name="id" value="" hidden>
					<div class="form-group">
						<label for="username" class="control-label">用戶名:</label> <input
							type="text" name="username" class="form-control" value="" required>
					</div>
					<div class="form-group">
						<label for="password" class="control-label">密 碼:</label> <input
							type="password" name="password" class="form-control" value="" required>
					</div>

				</div>
				<div class="modal-footer">
					<button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
					<button type="submit" class="btn btn-primary">添加</button>
				</div>
			</form>
		</div>
	</div>
</div>


<script type="text/javascript">
	// 刪除按鈕
	$(".delBtn").on("click", function() {
		$("#delid").val($(this).val());	// 獲取當前點擊按鈕的值value值,並賦值給刪除模態框的<input name="id"
	});
	// 編輯按鈕
	$(".edBtn").on("click", function() {
		$("#edId").val($(this).val());	// 獲取當前點擊按鈕的值value值,並賦值給編輯模態框的<input name="id"
		$("#username").val($(this).attr("n"));	//取按鈕上的自定義屬性值
		$("#password").val($(this).attr("p"));	//取按鈕上的自定義屬性值
	});
</script>
</html>

.啓動項目

歡迎頁

用戶信息展示

新增用戶

更新用戶

刪除用戶

如果這些功能都實現了,恭喜你!!!

這是彩蛋
百度網盤地址：
鏈接：https://pan.baidu.com/s/15Tbe7Mu0UVu4TG7uqO3NHg
提取碼：uk4h