AR삽질러

JSP 개인프로젝트(5) - 회원정보수정 본문

JAVA/JSP

JSP 개인프로젝트(5) - 회원정보수정

아랑팡팡 2023. 2. 17. 16:53
728x90

https://arang95.tistory.com/40

 

JSP 개인프로젝트(4) - 회원가입완성, 로그인구현

https://arang95.tistory.com/34 JSP 개인프로젝트(3) - 로그인, 회원가입 https://arang95.tistory.com/31 JSP 개인프로젝트(2) 회원테이블생성 zipcode생 1. 회원테이블스키마 생성 2. 우편번호 스키마생성 회원테이블

arang95.tistory.com

 

지난시간에는 회원가입과 로그인구현을 완성하였고 이번시간에는 등록된 회원의 정보를 수정하는 페이지를 구현해보겠다.

 코드 깨끗이 수정

 

DAO : getMember, updateStudent

JSP : modifyForm => modifyProc.jsp

 

회원정보 수정에서는 아이디와 성별은 바꾸지 못하게 하고 나머지부분은 수정이 가능하도록 설정하였다.

 

1. DAO getMember 

회원정보를 수정하기 위해서는 기존에 가입한 회원의 정보를 가져와야한다.

총 13개의 데이터가 있으니 get으로 해당 회원의 정보를 모두가져온다.

회원가입에서 사용했던 폼을 가져와 조금 수정하는 방식으로 구현

// 회원정보수정하기 위해서 회원가입한 정보중 id에 해당하는 정보를 가져오는 메서드
	public MemberVO getMember(String id) {

		Connection conn = null;
		PreparedStatement pstmt = null;
		ResultSet rs = null;
		MemberVO vo = null;
		try {
			conn = getConnection();
			pstmt = conn.prepareStatement("select * from member where id = ?");
			pstmt.setString(1, id);
			rs = pstmt.executeQuery();
			if(rs.next()) {
				vo = new MemberVO();
				vo.setId(rs.getString("id"));
				vo.setPass(rs.getString("pass"));
				vo.setName(rs.getString("name"));
				vo.setPhone1(rs.getString("Phone1"));
				vo.setPhone2(rs.getString("Phone2"));
				vo.setPhone3(rs.getString("Phone3"));
				vo.setAge(rs.getInt("age"));
				vo.setGender(rs.getString("gender"));
				vo.setEmail(rs.getString("email"));
				vo.setZipcode(rs.getString("zipcode"));
				vo.setAddress1(rs.getString("Address1"));
				vo.setAddress2(rs.getString("Address2"));
				vo.setProfile(rs.getString("Profile"));
			}
		}catch(Exception e) {
			e.printStackTrace();
		}finally {
			if(rs != null)try {rs.close();}catch(SQLException sqle1) {}
			if(pstmt != null)try {pstmt.close();}catch(SQLException sqle2) {}
			if(conn != null)try {conn.close();}catch(SQLException sqle3) {}
		}
		return vo;
	}

 

2. modifyForm

회원수정폼

id 와 vo를 가져와서 아디이와 성별부분만 제외하고 가입폼을 그대로 가져와사용

<title>회원정보수정</title>
	<script type="text/javascript" src="script.js"></script>
	<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
	<script src="../js/bootstrap.js"></script>
	
	
</head>
<body>
	<%
		String id = (String)session.getAttribute("id");
		MemberVO vo = dao.getMember(id);
		
	%>
	<nav class="navbar navbar-default">
	 <div class="navbar-header">
	  <button type="button" class="navbar-toggle collapsed"
	  	data-toggle="collapse" data-target="#bs-example-navbar-collapse-1"
	  	aria-expanded="false">
		 	<span class="icon-bar"></span>
		 	<span class="icon-bar"></span>
		 	<span class="icon-bar"></span>
		 </button>
		 <a class="navbar-brand" href="main.jsp">AR 웹페이지</a>
		</div>
		<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
		 <ul class="nav navbar-nav">
		  <li class="active"><a href="main.jsp">메인</a>
		 </ul>
		
		 <ul class="nav navbar-nav navbar-right">
		  <li class="dropdown">
		   <a href="#" class="dropdown-toggle"
		   	data-toggle="dropdown" role="button" aria-haspopup="true"
		   	aria-expanded="false"><%=id %>님 환영합니다.<span class="caret"></span>
		   </a>
		   <ul class="dropdown-menu">
		   	<li><a href="logoutAction.jsp">로그아웃</a></li>
		   	<li><a href="#">회원정보수정</a></li>
		   	<li><a href="#">회원탈퇴</a></li>
		   </ul>
		  </li>
		 </ul>
		
		 
		</div>
	</nav>
	
	<div class="container">
	 <form name="regForm" method="post" action="modifyProc.jsp">
	  <table class="table table-bordered table-hover" style="text-align: center; border: 1px solid #ddddddd">
	   <thead>
	    <tr>
	     <th colspan="3"><h4>회원 수정 정보 입력</h4></th>
	    </tr>
	   </thead>
	    <tbody>
	     <tr>
	      <td style="width:110px;"><h5>아이디</h5></td>
	      <td><h5><%=vo.getId() %></h5>
	      <input type="hidden" name="id" value="vo.getId()%>"></td>
	     </tr>
	     <tr>
	      <td style="width:110px;"><h5>비밀번호</h5></td>
	      <td class="2"><input onkeyup="passwordCheckFunction();" class="form-control" id="userPassword1" type="text" name="pass" maxlength="20" placeholder="비밀번호확인를 입력하세요." value="<%=vo.getPass()%>"></td>
	     </tr>
	     <tr>
	      <td style="width:110px;"><h5>비밀번호 확인</h5></td>
	      <td class="2"><input onkeyup="passwordCheckFunction();" class="form-control" id="userPassword12" type="text" name="repass" maxlength="20" placeholder="비밀번호확인를 입력하세요." value="<%=vo.getPass()%>"></td>
	     </tr>
	     <tr>
	      <td style="width:110px;"><h5>이름</h5></td>
	      <td class="2"><input class="form-control" id="userName" type="text" name="name" maxlength="20" placeholder="이름를 입력하세요." value="<%=vo.getName()%>"></td>
	     </tr>
	     <tr>
	      <td style="width:110px;"><h5>전화번호</h5></td>
	      <td style="text-align: left;">
	       <input type="text" name="phone1" size="8" value="<%=vo.getPhone1()%>"/> -
	       <input type="text" name="phone2" size="8" value="<%=vo.getPhone2()%>"/> -
	       <input type="text" name="phone3" size="8" value="<%=vo.getPhone3()%>"/>
	      </td>
	     </tr>
	     <tr>
	      <td style="width:110px;"><h5>나이</h5></td>
	      <td class="2"><input class="form-control" id="age" type="number" name="age" maxlength="20" placeholder="나이를 입력하세요." value="<%=vo.getAge()%>"></td>
	     </tr>
	     <tr>
	      <td style="width:110px;"><h5>성별</h5></td>
	      <td colspan="2" >
	       <div class="form-group" style="text-align: center; margin: 0 auto;">
	        <div class="btn-group" data-toggle="buttons">
	         <label class="btn btn-primary active">
	          <input type="radio" name="gender" autocomplete="off" value="남자" checked>남자
	         </label>
	         <label class="btn btn-primary">
	          <input type="radio" name="gender" autocomplete="off" value="여자">여자
	         </label>
	        </div>
	       </div>
	      </td>
	     </tr>
	     <tr>
	      <td style="width:110px;"><h5>이메일</h5></td>
	      <td><input class="form-control" type="text" name="email" maxlength="20" placeholder="이메일를 입력하세요." value="<%=vo.getEmail()%>"></td>
	     </tr>
	     <tr>
	      <td style="width:110px;"><h5>우편번호</h5></td>
	      <td><input class="form-control" type="text" name="zipcode" maxlength="20" placeholder="우편번호를 입력하세요" value="<%=vo.getZipcode()%>">
		  <td style="width: 110px;"><button class="btn btn-primary" onClick="zipCheck()" type="button">찾기</button></td>
	     </tr>
	     <tr>
	      <td style="width:110px;"><h5>주소1</h5></td>
	      <td><input class="form-control" type="text" name="address1" size="50" placeholder="주소를 입력하세요." value="<%=vo.getAddress1()%>"></td>
	     </tr>
	     <tr>
	      <td style="width:110px;"><h5>주소2</h5></td>
	      <td><input class="form-control" type="text" name="address2" size="30" placeholder="상세주소를 입력하세요." value="<%=vo.getAddress2()%>"></td>
	     </tr>
	     <tr>
	      <td style="width:110px;"><h5>프로필</h5></td>
	      <td><input class="form-control" type="text" name="profile" size="30" placeholder="프로필 사진을 등록하세요." value="<%=vo.getProfile()%>" ></td>
	      <td style="width: 110px;"><button class="btn btn-primary" onClick="#" type="button">사진찾기</button></td>
	     </tr>
	     <tr>
			<td colspan="2" align="center">
			<input class="btn btn-primary" type="button" value="정보수정" onClick="updateCheck()"/>&nbsp;&nbsp;
			<input class="btn btn-primary" type="reset" value="다시입력">
			</td>
			<td style="text-align: left;" colspan="3"><h5 style="color: red;" id="passwordCheckMessage"></h5>   
		</tr>				
  			</tbody>
  		</table>
	</form>
  </div>
</body>
</html>

회원가입 수정

 

 

3. updateMember  // id와 성별은 제외하고 회원정보를 업데이트해주는 메서드

여기서 시간을 많이 잡아먹어서 삽질을 많이 했다...

항상 삽질의 해결은 3초컷이지만 3초컷을 위해서 엄청난 시간이든다.ㅠㅠ

결국 문제였던것은 sql문 이였다....

// 회원정보 업데이트 메서드 id 아이디와 성별은 변경불가능
	public void updateMember(MemberVO vo) {
		Connection conn = null;
		PreparedStatement pstmt = null;
		try {
			conn = getConnection();
			pstmt = conn.prepareStatement("UPDATE member \r\n"
					+ "SET pass=?, name=?, phone1=?, phone2=?, phone3=?, age=?, email=?, zipcode=?, address1=?, address2=?, profile=? \r\n"
					+ "WHERE id=?");
			pstmt.setString(1, vo.getPass());
			pstmt.setString(2, vo.getName());
			pstmt.setString(3, vo.getPhone1());
			pstmt.setString(4, vo.getPhone2());
			pstmt.setString(5, vo.getPhone3());
			pstmt.setInt(6, vo.getAge());
			pstmt.setString(7, vo.getEmail());
			pstmt.setString(8, vo.getZipcode());
			pstmt.setString(9, vo.getAddress1());
			pstmt.setString(10, vo.getAddress2());
			pstmt.setString(11, vo.getProfile());
			pstmt.setString(12, vo.getId());
			pstmt.executeUpdate();
		}catch(Exception ex) {
			ex.printStackTrace();
		}finally {
			if(pstmt != null)try {pstmt.close();}catch(SQLException e) {}
			if(conn != null)try {conn.close();}catch(SQLException e) {}
		}
	}

 

4. modifyProc  회원정보 수정완료폼

여기서는 수정입력받은 회원정보를 받아 updateMember(vo)를 통해서 DB에서 update를 해준다.

<%
	String id = (String)session.getAttribute("id");
	vo.setId(id);
	dao.updateMember(vo);
%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>회원정보 수정완료</title>
<link href="style.css" rel="stylesheet" type="text/css">
<body bgcolor="#FFFFCC">
</head>
<body>
<center>
	<font size="5" face="바탕체">
		
		<br><h3>회원정보가 수정되었습니다.</h3>
		<%
		out.println("<a href=login.jsp>로그인</a>");
		%>
	</font>
</center>
</body>
</html>

정보수정후 로그인 버튼을 누르면 로그아웃 처리가 되면서 로그인화면으로 돌아가 다시로그인

 

5. 정보수정 확인

 

6. 구현영상 + DB확인

testID : admin12  -> admin

pass : 1234   -> 1111

회원정보 수정시 DB에도 바로 반영

 

 

다음시간에는 회원탈퇴를 삽질해보겠다...

 

 

 

 

 

728x90
반응형
LIST
저작자표시 비영리 동일조건

'JAVA > JSP' 카테고리의 다른 글

JSP 개인프로젝트(7) - singleton적용, 게시판만들기  (0) 2023.02.28
JSP 개인프로젝트(6) - 회원탈퇴  (0) 2023.02.17
JSP 개인프로젝트(4) - 회원가입완성, 로그인구현  (0) 2023.02.16
JSP 개인프로젝트(3) - 로그인, 회원가입  (0) 2023.02.05
JSP 개인프로젝트(2) 회원테이블생성 zipcode생  (3) 2023.02.04
'JAVA/JSP' Related Articles more