2-3. 아이디찾기 (jsp로 아이디찾기기능 구현하기)

• 로그인페이지에는 아이디찾기와 비밀번호찾기 버튼이 있다

• 아이디찾기를 누르면 휴대폰본인확인 페이지가 뜬다

• 등록된 정보가 없을 때는 없다고 뜬다
• 다시찾기와 회원가입버튼이 있다
• 또한 밑에는 홈페이지광고이미지가 떠서 자연스럽게 프로모션가능하도록 하였다
  • 자세히보면 fineapple로고가 있다 ...ㅎ

• 정보가 있을 경우에는 아래와 같이 아이디가 네모상자 안에 뜨도록 하였다
• 아이디를 찾았으니 바로 로그인 가능하도록 로그인버튼을 아래에 배치하였다

 

 

 

---

 

 

 

 

 

 

• findId.jsp
  • form태그를 사용하였고 method는 post로 줌
  • 이름과 번호입력할 수 있는 input 삽입
    • 번호를 입력했을 경우 자동으로 '-'하이픈이 붙도록 addHypen함수를 onKeyup으로 적용
  • 찾기 버튼을 클릭했을 경우 id_search()함수를 실행하도록
  • 취소 버튼을 클릭했을 경우 뒤로가도록 history.back()를 삽입

	<form name="idfindscreen" method = "POST">
			<div class = "search-title">
				<h3>휴대폰 본인확인</h3>
			</div>
		<section class = "form-search">
			<div class = "find-name">
				<label>이름</label>
				<input type="text" name="member_name" class = "btn-name" placeholder = "등록한 이름">
			<br>
			</div>
			<div class = "find-phone">
				<label>번호</label>
				<input type="text" onKeyup = "addHypen(this);" name="member_phone" class = "btn-phone" placeholder = "휴대폰번호를 '-'없이 입력">
			</div>
			<br>
	</section>
	<div class ="btnSearch">
		<input type="button" name="enter" value="찾기"  onClick="id_search()">
		<input type="button" name="cancle" value="취소" onClick="history.back()">
 	</div>
 </form>

 

 

 

 

 

 

• findinfo.js
  • id_search라는 함수를 생성
    • 이름의 value길이가 1보다 작을 때 = 아무것도 입력이 안됐을 경우는 이름을 입력하라는 alert가 뜨고 rerutn되도록
    • 핸드폰번호가 13자리가 아니라면 확인창이 뜨고 return되도록
  • findIdResult.jsp로 넘어가도록 action을 주고 submit

function id_search() { 
	 	var frm = document.idfindscreen;

	 	if (frm.member_name.value.length < 1) {
		  alert("이름을 입력해주세요");
		  return;
		 }

		 if (frm.member_phone.value.length != 13) {
			  alert("핸드폰번호를 정확하게 입력해주세요");
			  return;
		 }

	 frm.method = "post";
	 frm.action = "findIdResult.jsp"; //넘어간화면
	 frm.submit();  
	 }

 

 

 

 

 

 

 

• findIdResult.jsp
  • 스크립틀릿 
    • name과 phone값을 가져온다
    • dao.findId를 가져와 member_mid로 선언
  • 정보가 있을 경우(member_mid가 null값이 아닐것)
    • 아이디를 그대로 출력해준다 <%=member_mid%>
    • 바로 로그인을 할 수 있도록 로그인버튼을 넣어주었다
  • 정보가 없을 경우(else)
    • 등록된 정보가 없다고 뜨도록
    • 다시찾기와 회원가입이 떠서 접근성이 좋게 하였음
    • 광고이미지가 뜨도록

<%
 request.setCharacterEncoding("UTF-8");
    String member_name = request.getParameter("member_name");
     String member_phone = request.getParameter("member_phone");
     
MemberDao dao = new MemberDao();
 String member_mid = dao.findId(member_name, member_phone); //아이디를 디비에서 가져옴..실패시 널
 
%>

  <form name="idsearch" method="post">
      <%
       if (member_mid != null) {
      %>
      
      <div class = "container">
      	<div class = "found-success">
	      <h4>  회원님의 아이디는 </h4>  
	      <div class ="found-id"><%=member_mid%></div>
	      <h4>  입니다 </h4>
	     </div>
	     <div class = "found-login">
 		    <input type="button" id="btnLogin" value="로그인" onClick = 'login()'/>
       	</div>
       </div>
      <%
  } else {
 %>
        <div class = "container">
      	<div class = "found-fail">
	      <h4>  등록된 정보가 없습니다 </h4>  
	     </div>
	     <div class = "found-login">
 		    <input type="button" id="btnback" value="다시 찾기" onClick="history.back()"/>
 		    <input type="button" id="btnjoin" value="회원가입" onClick="joinin()"/>
       	</div>
       </div>
       
    <div class = "adcontainer">
	<a href="#" ><img src = "../images/casead.png" /></a>                
</div>   
       <%
  }
 %> 
      </form>
   

 

 

 

 

 

 

• findId 메소드
  • 매개변수는 name과 phone이다 (그것을 입력했으니)
  • 반환값은 mid이며 null로 초기화를 해준다
  • 쿼리 해석 : name이 ? 고 phone이 ?인 id를 members테이블에서 찾아라

	public String findId(String member_name, String member_phone) {
		String mid = null;
		
		try {
			String sql = "select member_mid from members where member_name=? and member_phone=? ";
			ps = conn.prepareStatement(sql);
			ps.setString(1, member_name);
			ps.setString(2, member_phone);
			
			rs = ps.executeQuery();
			
			if(rs.next()) {
				mid = rs.getString("member_mid");
			}
				
		} catch (Exception e) {
			e.printStackTrace();
		}
		return mid;
	}