프로그래밍/JSP / / 2021. 8. 23. 19:40

JSP - 미니 프로젝트(5. 정보수정)

이번에는 로그인상태일때 회원 정보수정을 해보겠습니다.

 

로그인상태일시 정보수정을 눌러보자

 

header.jsp

정보수정 태그에 memberModify 로 요청하도록 수정한다.

<%@page import="member.model.vo.Member"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%
	Member userLogin = (Member) request.getSession().getAttribute("userLogin");
	// System.out.println(userLogin);
%>    

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<link href="<%=request.getContextPath() %>/resources/css/menubar-style.css" rel="stylesheet">
<%if(session.getAttribute("msg") != null){ %>
<script>
	alert('<%= (String) session.getAttribute("msg") %>');
</script>
	
<%
 session.removeAttribute("msg");
} %>
</head>
<body>
	<div class="wrapper">
        <header id="header">
	        <!-- 로고 이미지를 클릭하면 첫 화면으로 -->
            <a href="<%= request.getContextPath() %>">
                <img class="logo" src="<%= request.getContextPath() %>/resources/images/logo.png" alt="JSP HOME">
            </a>
            <!-- 회원가입/로그인 -->
            
            <div class="btnArea">
           	<%if(userLogin == null) {%>
            	<a href="<%= request.getContextPath() %>/memberJoin">회원가입</a>
            	<a href="<%= request.getContextPath() %>/login">로그인</a>
            <%} else { %>
            	<a href="<%= request.getContextPath()%>/memberModify">정보수정</a>
            	<a href="<%= request.getContextPath()%>/logout">로그아웃</a>
            <%} %>
            </div>
        </header>
        <nav id="nav">
        	<ul>
        		<li><a href="<%= request.getContextPath() %>">HOME</a></li>
        		<li><a href="#">공지사항</a></li>
        		<li><a href="#">게시판</a></li>
        		<li><a href="#">사진게시판</a></li>
        	</ul>
        </nav>

   </div>

</body>
</html>

 

memberModify.java

저장되어있는 세션의 정보를 가져오고 

만약 로그인 상태가 아닐시 로그인을 먼저진행하는 오류 메세지를발생시키는코드입니다.

로그인상태일시 memberModifyForm.jsp 로 이동하는 코드입니다.

package member.controller;

import java.io.IOException;
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 member.model.vo.Member;

@WebServlet("/memberModify")
public class MemberModifyServlet extends HttpServlet {
	private static final long serialVersionUID = 1L;
       
	protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		
		Member userLogin = (Member) request.getSession().getAttribute("userLogin");
		String view= "";
		if(userLogin != null) {
			view = "/WEB-INF/views/member/memberModifyForm.jsp";
		}else {
			request.setAttribute("msg", "로그인을 먼저 진행해주세요.");
			view = "/WEB-INF/views/common/errorpage.jsp";
		}
		
		request.getRequestDispatcher(view).forward(request, response);
		
	}

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

}

 

memberModifyForm.jsp

자여기서 정보수정을 해야하기때문에 기존에 로그인되어있는 사람기준으로 수정을할것이다.

그런데 정보수정은 처음부터 입력하는것이아니라 

회원의정보를 기본으로 보여준상태에서 수정하는방식이다.

 

수정이불가한 항목은 아이디, 연락처, 이메일이고

나머지는 수정이가능하다.

세션을 이용해 <%= %> 로 동적으로 표시한다.

 

그리고 주소같은경우는 ,를 기준으로 spite()메소드이용하여 배열로 만들어서 출력하였다.

마지막 체크박스는 

이런식으로 저장되어있는데 

체크박스도 마찬가지로 ,를 기준으로 splite 배열로만들어 작업하였다.

 

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>정보수정</title>
<style>
	.outer{
		width:60%;
		min-width : 650px;
		background: rgb(248, 249, 250);
		box-shadow: rgba(0, 0, 0, 0.06) 0px 0px 4px 0px;
		margin:auto;
		margin-top : 70px;
		margin-bottom : 70px;
	}
	
	#joinForm {
		width : 400px;
		margin: auto;
		padding: 10px;
	}
	
	#joinForm h1 {
		text-align:center;
	}
	

	.input_area {
	    border: solid 1px #dadada;
	    padding : 10px 10px 14px 10px;
	    background : white;
	}
	

	.input_area input:not([type=checkbox]) {
		width : 250px;
		height : 30px;
		border: 0px;
	}
	
	.btnArea {
		text-align:center;
		padding : 50px;
	}
	
	button {
		width : 100px;
		height : 35px;
		border : 0px;
		color:white;
		background:#282A35;
		margin : 5px;
	}
	
</style>

</head>
<body>
	<!-- index.jsp 생성 후 모든 페이지에 include할 menubar.jsp 생성 -->
	<%@ include file="/WEB-INF/views/common/header.jsp" %>

	<div class="outer">
		<div id="joinInfoArea">
			<form id="joinForm" action="<%= request.getContextPath() %>/memberModify"
			method="post" onsubmit="return validate();">
				<h1>정부 수정</h1>
				
				<h4>* 아이디</h4>
				<span class="input_area"><input type="text" maxlength="13" name="userId" value="<%= userLogin.getUserId() %>" readonly></span>
				
				<h4>* 비밀번호</h4>
				<span class="input_area"><input type="password" maxlength="15" name="userPwd" value="<%= userLogin.getUserPwd() %>"></span>
				<button id="pwdUpdateBtn" type="button">비밀번호 변경</button>
								
				<h4>* 이름</h4>
				<span class="input_area"><input type="text" maxlength="5" name="userName" value="<%= userLogin.getUserName() %>"></span>
				
				<h4>연락처</h4>
				<span class="input_area"><input type="tel" maxlength="11" name="phone"
										placeholder="(-없이)01012345678" value="<%= userLogin.getPhone() %>" readonly></span>
										
				<h4>이메일</h4>
				<span class="input_area"><input type="email" name="email" value="<%= userLogin.getEmail() %>" readonly></span>
				
				<%-- 우편번호 가져오기 --%>
				<%
					String[] addressArr = null;
					if(userLogin.getAddress() != null){
						addressArr = userLogin.getAddress().split(",");
						// System.out.println(addressArr[0]);
						// System.out.println(addressArr[1]);
						// System.out.println(addressArr[2]);
					}else{
						addressArr = new String[]{"", "", ""};
					}
				%>
				
				<h4>우편번호</h4>
				<span class="input_area"><input type="text" name="address" class="postcodify_postcode5" value="<%= addressArr[0] %>" readonly></span>
				<button type="button" id="postcodify_search_button">검색</button>
				<h4>도로명주소</h4>
				<span class="input_area"><input type="text" name="address" class="postcodify_address" value="<%= addressArr[1] %>" readonly></span>
				<h4>상세주소</h4>
				<span class="input_area"><input type="text" name="address" class="postcodify_details" value="<%= addressArr[2] %>"></span>
				
				<%-- 관심분야 가져오기 --%>
				<%
					String[] interest = new String[6];
					if(userLogin.getInterest() != null){
						String[] interestArr = userLogin.getInterest().split(",");
						for(int i = 0; i < interestArr.length; i++){
							switch(interestArr[i]){
								case "운동" :  interest[0] = "checked"; break;
								case "등산" :  interest[1] = "checked"; break;
								case "낚시" :  interest[2] = "checked"; break;
								case "요리" :  interest[3] = "checked"; break;
								case "게임" :  interest[4] = "checked"; break;
								case "기타" :  interest[5] = "checked"; break;
							}
						}
						
					}
				%>
				
				<h4>관심분야</h4>
				<span class="input_area">
					<input type="checkbox" id="sports" name="interest" value="운동" <%=interest[0] != null ? interest[0] : "" %>>
					<label for="sports">운동</label>
					<input type="checkbox" id="climbing" name="interest" value="등산" <%=interest[1] != null ? interest[1] : "" %>>
					<label for="climbing">등산</label>
					<input type="checkbox" id="fishing" name="interest" value="낚시" <%=interest[2] != null ? interest[2] : "" %>>
					<label for="fishing">낚시</label>
					<input type="checkbox" id="cooking" name="interest" value="요리" <%=interest[3] != null ? interest[3] : "" %>>
					<label for="cooking">요리</label>
					<input type="checkbox" id="game" name="interest" value="게임" <%=interest[4] != null ? interest[4] : "" %>>
					<label for="game">게임</label>
					<input type="checkbox" id="etc" name="interest" value="기타" <%=interest[5] != null ? interest[5] : "" %>>
					<label for="etc">기타</label>
				</span>
				<div class="btnArea">
					<button id="joinBtn">가입하기</button>
				</div>
			</form>
		</div>
	</div>
	
	<!-- 주소 API 스크립트 -->
	<!-- jQuery와 Postcodify를 로딩한다 -->
	<script src="//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
	<script src="//d1p7wdleee1q2z.cloudfront.net/post/search.min.js"></script>
	
	<!-- "검색" 단추를 누르면 팝업 레이어가 열리도록 설정한다 -->
	<script> $(function() { $("#postcodify_search_button").postcodifyPopUp(); }); </script>
	
	<script>
		function validate(){
			return true;
		}
	</script>
</body>
</html>

 

 

MemberService.java

package member.service;

import static common.JDBCTemplate.*;

import java.sql.Connection;

import member.model.dao.MemberDAO;
import member.model.vo.Member;

public class MemberService {
	
	// 1. 로그인
	public Member loginMember(String id, String pwd) {
		
		Connection conn = getConnection();
		
		Member loginUser = new MemberDAO().loginMember(conn, id, pwd);
		
		
		return loginUser;
	}
	
	// 회원가입
	public int memberJoin(Member member) {
		
		Connection conn = getConnection();
		
		int result = new MemberDAO().memberJoin(conn, member);
		
		if(result > 0) {
			commit(conn);
		}else {
			rollback(conn);
		}
		
		close(conn);
		
		return result;
	}
	
}

 

MemberDAO.java

package member.model.dao;

import java.io.FileInputStream;
import java.io.IOException;
import java.sql.Connection;
import java.sql.PreparedStatement;
import java.sql.ResultSet;
import java.sql.SQLException;
import java.util.Properties;

import member.model.vo.Member;
import static common.JDBCTemplate.close;

public class MemberDAO {
	Properties prop = new Properties();
	
	public MemberDAO() {
		String fileName = MemberDAO.class.getResource("/sql/member/member-query.xml").getPath(); 
		try {
			prop.loadFromXML(new FileInputStream(fileName));
		} catch (IOException e) {
			e.printStackTrace();
		}
		
	}
	
	// 1. 로그인 기능
	public Member loginMember(Connection conn, String id, String pwd) {
		PreparedStatement pstmt = null;
		ResultSet rs = null;
		Member member = null;
		String sql = prop.getProperty("loginMember");
		// System.out.println(sql);
		
		try {
			pstmt = conn.prepareStatement(sql);
			pstmt.setString(1, id);
			pstmt.setString(2, pwd);
			rs = pstmt.executeQuery();
			
			if(rs.next()) {
				member = new Member(
										    rs.getInt("USER_NO"),
										    rs.getString("USER_ID"),
										    rs.getString("USER_PWD"),
										    rs.getString("USER_NAME"),
										    rs.getString("PHONE"),
										    rs.getString("EMAIL"),
										    rs.getString("ADDRESS"),
										    rs.getString("INTEREST"),
										    rs.getDate("ENROLL_DATE"),
										    rs.getDate("MODIFY_DATE"),
										    rs.getString("STATUS")
						);
				// System.out.println(member);
				
			}
		} catch (SQLException e) {
			e.printStackTrace();
		} finally {
			close(rs);
			close(pstmt);
			
		}
		
		return member;
	}
	
	// 회원가입
	public int memberJoin(Connection conn, Member member) {
		int result = 0;
		PreparedStatement pstmt = null;
		String sql = prop.getProperty("memberJoin");
		// System.out.println(sql);
		
		try {
			pstmt = conn.prepareStatement(sql);
			pstmt.setString(1, member.getUserId());
			pstmt.setString(2, member.getUserPwd());
			pstmt.setString(3, member.getUserName());
			pstmt.setString(4, member.getPhone());
			pstmt.setString(5, member.getEmail());
			pstmt.setString(6, member.getAddress());
			pstmt.setString(7, member.getInterest());
			
			result = pstmt.executeUpdate();
		} catch (SQLException e) {
			e.printStackTrace();
		} finally {
			close(pstmt);
		}
		
		return result;
	}
	
}

 

여기까지하고 서버를 재가동후

정보수정을 눌러확인해보자

그럼 아래와같이 가입했을때 정보로 출력이되는것을 확인할수있다.

저작자표시

'프로그래밍 > JSP' 카테고리의 다른 글

JSP - 미니프로젝트(5. 공지사항 목록, 글쓰기,글 상세, )  (0) 2021.08.30
JSP - EL/JSTL  (0) 2021.08.27
JSP - 미니 프로젝트(4. 회원가입)  (1) 2021.08.23
JSP - 미니 프로젝트(3. 로그아웃)  (0) 2021.08.23
JSP - 미니 프로젝트(2. 로그인)  (0) 2021.08.23
  • 네이버 블로그 공유
  • 네이버 밴드 공유
  • 페이스북 공유
  • 카카오스토리 공유
프로그래밍/JSP 관련 글
글 더보기

티스토리툴바