개발/Servlet/JSP 게시판 만들기

[서블릿 Servlet JSP 게시판 만들기] 07. 회원관리 기능 구현

Monsh 2021. 2. 13. 13:25
반응형

본 시리즈의 이전 게시글 목록

[서블릿 Servlet JSP 게시판 만들기] 01. 개발 환경 구성
[서블릿 Servlet JSP 게시판 만들기] 02. Server/Web 프로젝트 생성

[서블릿 Servlet JSP 게시판 만들기] 03. Preferences 설정

[서블릿 Servlet JSP 게시판 만들기] 04. 회원가입 기능 구현 1 - JSP

[서블릿 Servlet JSP 게시판 만들기] 05. 회원가입 기능 구현 2 - MariaDB 설치

[서블릿 Servlet JSP 게시판 만들기] 06. 회원가입 기능 구현 3 - DB 연동

1. 테이블 수정

HeidiSQL -> my_project -> user 테이블을 클릭
u_no, u_age를 아래와 같이 수정합니다.


2. 회원 목록 보기

WebContent 폴더 안에 userlist.jsp를 생성합니다.

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>회원 목록</title>
</head>
<style>
	table {
		border-collapse:collapse;
	}
	table tr th {
		font-weight:700;
	}
	table tr td, table tr th {
		border:1px solid #818181;
		width:200px;
		text-align:center;
	}
</style>
<body>
<%@ include file="db_connection.jsp" %>
	<h1>회원 목록</h1>
	<table>
		<tr>
			<th>No</th>
			<th>ID</th>
			<th>이름</th>
		</tr>
			<%
				PreparedStatement pstmt = null;
				ResultSet rs = null;
				
				String query = "select * from user";
				pstmt = conn.prepareStatement(query);
				
				rs = pstmt.executeQuery();
				
				while(rs.next()){
					String u_idx = rs.getString("u_idx");
					String u_id = rs.getString("u_id");
					String u_name = rs.getString("u_name");
			%>
			<tr>
				<td><a href="userDetail.jsp?u_idx=<%=u_idx%>"><%=u_idx %></a></td>
				<td><%=u_id %></td>
				<td><%=u_name %></td>
			<tr>
			<%
				}
				rs.close();
				pstmt.close();
				conn.close();
			%>
	</table>
</body>
</html>

3. 회원 정보

WebContent 폴더 안에 userDetail.jsp를 생성합니다.

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>회원 상세</title>
</head>
<style>
	table {
		border-collapse:collapse;
	}
	table tr th {
		font-weight:700;
	}
	table tr td, table tr th {
		border:1px solid #818181;
		width:200px;
		text-align:center;
	}
	a {
		text-decoration:none;
		color:#000;
		font-weight:700;
		border:none;
		cursor:pointer;
		padding:10px;
		display:inline-block
	}
</style>
	
<body>
<%@ include file="db_connection.jsp" %>
	<h1>회원 상세페이지</h1>
	<table>
	<%
		String idx = request.getParameter("u_idx");
		
		PreparedStatement pstmt = null;
		ResultSet rs = null;
		
		String query = "select * from user where u_idx=?";
		pstmt = conn.prepareStatement(query);
		pstmt.setString(1, idx);
		
		rs = pstmt.executeQuery();
		
		while(rs.next()){
			String u_idx = rs.getString("u_idx");
			String u_id = rs.getString("u_id");
			String u_name = rs.getString("u_name");
			String u_tel = rs.getString("u_tel");
			String u_age = rs.getString("u_age");
	%>
	<tr>
		<td>회원 번호</td>
		<td><%=u_idx %></td>
	</tr>
	<tr>
		<td>회원 ID</td>
		<td><%=u_id %></td>
	</tr>
	<tr>
		<td>회원 이름</td>
		<td><%=u_name %></td>
	</tr>
	<tr>
		<td>회원 전화번호</td>
		<td><%=u_tel %></td>
	</tr>
	<tr>
		<td>회원 나이</td>
		<td><%=u_age %></td>
	</tr>
	<tr style="height:50px;">
		<td style="border:none;">
			<a href="userEdit.jsp?u_idx=<%=u_idx %>" style="width:70%; font-weight:700; background-color:#818181; color:#fff;">수정</a>
		</td>
		<td style="border:none;">
			<a href="userDelete.jsp?u_idx=<%=u_idx %>" style="width:70%; font-weight:700; background-color:red; color:#fff;">삭제</a>
		</td>
	</tr>
	<%
		}
	%>
	
	</table>
</body>
</html>

4. 회원 정보 수정

WebContent 폴더 안에 userEdit.jsp를 생성합니다.

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>회원 수정</title>
</head>
<body>
<%@ include file="db_connection.jsp" %>
	<h1>회원 정보 수정</h1>
	<%
		String idx = request.getParameter("u_idx");
	
		PreparedStatement pstmt = null;
		ResultSet rs = null;
		
		String query = "select * from user where u_idx=?";
		pstmt = conn.prepareStatement(query);
		pstmt.setString(1, idx);
		
		rs = pstmt.executeQuery();
		
		while(rs.next()){
			String u_idx = rs.getString("u_idx");
			String u_id = rs.getString("u_id");
			String u_password = rs.getString("u_pw");
			String u_name = rs.getString("u_name");
			String u_tel = rs.getString("u_tel");
			String[] tel = u_tel.split("-");
			String u_age = rs.getString("u_age");
	%>
		<form action="editProcess.jsp" name="user" method="post">
			<input type="hidden" name="u_idx" value="<%=u_idx%>">
			<p> 아이디 : <input type="text" name="edit_id" value="<%=u_id %>"></p>
			<p> 비밀번호 : <input type="password" name="edit_password" value="<%=u_password %>"></p>
			<p> 이름 : <input type="text" name="edit_name" value="<%=u_name %>"></p>
			<p> 연락처 : <input type="text" maxlength="4" size="4" name="edit_tel1" value="<%=tel[0] %>">
					   <input type="text" maxlength="4" size="4" name="edit_tel2" value="<%=tel[1] %>">
					   <input type="text" maxlength="4" size="4" name="edit_tel3" value="<%=tel[2] %>">
			</p>
			<p> 나이 : <input type="text" name="edit_age" value="<%=u_age %>"></p>
			<p> <input type="submit" value="수정완료"></p>
		</form>
	<%
		}
	%>
</body>
</html>

WebContent 폴더 안에 editProcess.jsp를 생성합니다.

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>수정 값 넘겨받기</title>
</head>
<body>
<%@ include file="db_connection.jsp" %>
<%
	request.setCharacterEncoding("UTF-8");
	String idx = request.getParameter("u_idx");
	String id = request.getParameter("edit_id");
	String password = request.getParameter("edit_password");
	String name = request.getParameter("edit_name");
	String tel1 = request.getParameter("edit_tel1");
	String tel2 = request.getParameter("edit_tel2");
	String tel3 = request.getParameter("edit_tel3");
	String tel = tel1 + "-" + tel2 + "-" + tel3;
	String age = request.getParameter("edit_age");
	
	PreparedStatement pstmt = null;
	
	try {
		String sql = "UPDATE user SET u_id=?, u_pw=?, u_name=?, u_tel=?, u_age=? where u_idx=?";
		pstmt = conn.prepareStatement(sql);
		
		pstmt.setString(1, id);
		pstmt.setString(2, password);
		pstmt.setString(3, name);
		pstmt.setString(4, tel);
		pstmt.setString(5, age);
		pstmt.setString(6, idx);
		pstmt.executeUpdate();
%>
		<h3>수정 완료</h3>
<%
	} catch(SQLException ex) {
		System.out.println("SQLException : " + ex.getMessage());
	} finally {
		if(pstmt != null) {
			pstmt.close();
		}
		if(conn != null) {
			conn.close();
		}
	}
%>
<a href="userlist.jsp">돌아가기</a>
</body>
</html>

5. 회원 삭제

WebContent 폴더 안에 userDelete.jsp를 생성합니다.

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>회원 삭제</title>
</head>
<body>
<%@ include file="db_connection.jsp" %>

<%
	String idx = request.getParameter("u_idx");
	System.out.println(idx);
	
	PreparedStatement pstmt = null;
	
	String query = "delete from user where u_idx=?";
	pstmt = conn.prepareStatement(query);
	pstmt.setString(1, idx);
	pstmt.executeUpdate();
%>
	<h2>삭제 완료</h2>
<script>
setTimeout(function () {
	window.location.href = "userlist.jsp";
})
</script>
</body>
</html>

6. 결과 화면

userlist.jsp를 Run on Server 합니다.

반응형