본문 바로가기
Tech/Web

[JSP&Servlet] 회원가입 페이지 작성하기(서블릿,JSP,Js페이지 코드)

by 소라소라잉 2019. 4. 22.

< 완성된 페이지 > 

< 소스 코드_서블릿 > 

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
import java.io.IOException;
import java.io.PrintWriter;
 
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
 
@WebServlet("/JoinServlet")
public class JoinServlet extends HttpServlet {
    private static final long serialVersionUID = 1L;
 
    StringBuilder sb = new StringBuilder();
    StringBuilder sbadress = new StringBuilder();
 
    public JoinServlet() {
        super();
 
    }
 
    protected void doGet(HttpServletRequest request, HttpServletResponse response)
            throws ServletException, IOException {
        response.setContentType("text/html;charset=UTF-8");
 
        PrintWriter out = response.getWriter();
        out.print("<html><body>");
 
        String name = request.getParameter("name");
        sb.append(request.getParameter("id_front"));
        sb.append("-");
        sb.append(request.getParameter("id_back"));
        String idNumber = sb.toString();
        String id = request.getParameter("id");
        String pw = request.getParameter("pw");
        String eMail = request.getParameter("eMail");
        String eMailSite = request.getParameter("eMailSite");
        String eMailForm = request.getParameter("eMailForm");
        String test = "직접입력";
        if (test.equals(request.getParameter("eMailForm"))) {
            eMail += "@" + eMailSite;
        } else
            eMail += "@" + eMailForm;
        String postNumber = request.getParameter("postNumber");
        sbadress.append(request.getParameter("adress1"));
        sbadress.append(request.getParameter("adress2"));
        String adress = sbadress.toString();
        String phoneNumber = request.getParameter("phoneNumber");
        String occupation = request.getParameter("occupation");
        String[] interests = request.getParameterValues("interests");
 
        out.println("이름 : <b>");
        out.println(name);
        out.println("</b><br>주민번호 : <b>");
        out.println(idNumber);
        out.println("</b><br>아이디 : <b>");
        out.println(id);
        out.println("</b><br>비밀번호 : <b>");
        out.println(pw);
        out.println("</b><br>이메일 : <b>");
        out.println(eMail);
        out.println("</b><br>우편번호 : <b>");
        out.println(postNumber);
        out.println("</b><br>주소 : <b>");
        out.println(adress);
        out.println("</b><br>핸드폰번호 : <b>");
        out.println(phoneNumber);
        out.println("</b><br>직업 : <b>");
        out.println(occupation);
        out.println("</b><br>관심분야 : <b>");
        if (interests == null) {
            out.println("선택한 항목이 없습니다.");
        } else {
            for (String interest : interests)
                out.print(interest + " ");
        }
 
        out.print("</b><br><a href='javascript:history.go(-1)'>다시</a>");
        out.print("</html></body>");
        out.close();
 
    }
 
    protected void doPost(HttpServletRequest request, HttpServletResponse response)
            throws ServletException, IOException {
 
        doGet(request, response);
    }
 
}
cs

 

< 소스 코드_JSP >

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>회원 가입</title>
<script type="text/javascript" src="Check_Join.js"></script>
</head>
<body>
<form method="get" action="JoinServlet" name="frm">
<table>
<tr>
<td bgcolor = "#f2f2f2">이름</td>
<td><input type="text" name="name"></td>
</tr>
 
<tr>
<td bgcolor = "#f2f2f2">주민등록번호</td>
<td>
<input type="text" name="id_front"> - <input type="password" name="id_back">
</td>
 
<tr>
<td bgcolor = "#f2f2f2">아이디</td>
<td><input type="text" name="id"></td>
</tr>
 
<tr>
<td bgcolor = "#f2f2f2">비밀번호</td>
<td><input type="password" name="pw"></td>
</tr>
<tr>
<td bgcolor = "#f2f2f2">비밀번호확인</td>
<td><input type="password" name="check_pw"></td>
</tr>
<tr>
<td bgcolor = "#f2f2f2">이메일</td>
<td><input type="text" name="eMail"> @ <input type="text" name="eMailSite" value = "" disabled>
<select id="eMailForm" name="eMailForm" size="1" onchange="email_check()">
<option value="선택하세요" >선택하세요</option>
<option id="9" >직접입력</option>
<option value="naver.com" >naver.com</option>
<option value="hanmail.net" >hanmail.net</option>
<option value="daum.net" >daum.net</option>
<option value="nate.com" >nate.com</option>
<option value="samsung.com" >samsung.com</option>
<option value="gmail.com" >gmail.com</option>
</select></td>
</tr>
 
 
<tr>
<td bgcolor = "#f2f2f2">우편번호</td>
<td><input type="text" name="postNumber"></td>
</tr>
 
<tr>
<td bgcolor = "#f2f2f2">주소</td>
<td><input type="text" name="adress1"> <input type="text" name="adress2"></td></tr>
 
<tr>
<td bgcolor = "#f2f2f2">핸드폰번호</td>
<td><input type="text" name="phoneNumber" id="phoneNumber"></td>
</tr>
 
<tr>
<td bgcolor = "#f2f2f2">직업</td>
<td> <select id="occupation" name="occupation" size="1">
<option value="학생" >학생</option>
<option value="컴퓨터/인터넷" >컴퓨터/인터넷</option>
<option value="언론" >언론</option>
<option value="공무원" >공무원</option>
<option value="군인" >군인</option>
<option value="서비스업" >서비스업</option>
<option value="교육" >교육</option>
</select>
</td>
</table>
<br>
 
<label for ="check_mail">메일/SMS 정보 수신</label>
<input type="radio" id="check_mail" name="check_mail" value="yes" checked> 수신
<input type="radio" id="check_mail" name="check_mail" value="no" checked> 수신거부<br><br>
 
<label for = "interests">관&nbsp;심&nbsp;항&nbsp;목 </label>
<input type="checkbox" name="interests" id="interests" value="생두"> 생두
<input type="checkbox" name="interests" id="interests" value="원두"> 원두
<input type="checkbox" name="interests" id="interests" value="로스팅"> 로스팅
<input type="checkbox" name="interests" id="interests" value="핸드드립"> 핸드드립
<input type="checkbox" name="interests" id="interests" value="에스프레소"> 에스프레소
<input type="checkbox" name="interests" id="interests" value="창업"> 창업 <br><br>
 
<input type="submit" value="회원가입" onclick="return check()">
<input type="reset" value="취소">
 
 
</form>
 
</body>
</html>
cs

 

< 소스 코드_Javascript >

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
function email_check() {
    if (document.frm.eMailForm.options[document.frm.eMailForm.selectedIndex].value == "선택하세요") {
        document.frm.eMailSite.disabled = true;
        document.frm.eMailSite.value = "";
    }
    if (document.frm.eMailForm.options[document.frm.eMailForm.selectedIndex].id == "9") {
        document.frm.eMailSite.disabled = false;
        document.frm.eMailSite.value = "";
        document.frm.eMailSite.focus();
    } else {
        document.frm.eMailSite.disabled = true;
        document.frm.eMailSite.value= 
            document.frm.eMailForm.options[document.frm.eMailForm.selectedIndex].value;
    }
}
 
function check() {
    if (document.frm.name.value == "") {
        alert("이름을 입력해주세요.");
        document.frm.name.focus();
        return false;
    } else if (document.frm.id_front.value == "") {
        alert("주민등록번호 앞자리를 입력해주세요.");
        document.frm.id_front.focus();
        return false;
    } else if (document.frm.id_back.value == "") {
        alert("주민등록번호 뒷자리를 입력해주세요.");
        document.frm.id_back.focus();
        return false;
    } else if (document.frm.id.value == "") {
        alert("아이디를 입력해주세요.");
        document.frm.id.focus();
        return false;
    } else if (document.frm.pw.value == "") {
        alert("비밀번호를 입력해주세요.");
        document.frm.pw.focus();
        return false;
    } else if (document.frm.check_pw.value == "") {
        alert("비밀번호 확인란을 입력해주세요.");
        document.frm.check_pw.focus();
        return false;
    } else if (document.frm.pw.value != document.frm.check_pw.value) {
        alert("입력된 비밀번호가 비밀번호 확인란에 입력된 비밀번호와 다릅니다.");
        document.frm.check_pw.focus();
        return false;
    } else if (document.frm.eMail.value == "") {
        alert("이메일을 입력해주세요.");
        document.frm.eMail.focus();
        return false;
    } else if (document.frm.eMailSite.value == "") {
        alert("이메일사이트를 입력해주세요.");
        document.frm.eMailSite.focus();
        return false;
    } else if (document.frm.postNumber.value == "") {
        alert("우편번호를 입력해주세요.");
        document.frm.postNumber.focus();
        return false;
    } else if (document.frm.adress1.value == "") {
        alert("주소를 입력해주세요.");
        document.frm.adress1.focus();
        return false;
    } else if (document.frm.adress2.value == "") {
        alert("상세주소를 입력해주세요.");
        document.frm.adress2.focus();
        return false;
    } else if (document.frm.phoneNumber.value == "") {
        alert("핸드폰번호를 입력해주세요.");
        document.frm.phoneNumber.focus();
        return false;
    } else if (document.frm.occupation.value == "") {
        alert("직업을 선택해주세요.");
        document.frm.occupation.focus();
        return false;
    } else {
        return true;
    }
 
}
cs

 

 

< 새로 알게 된 것 >

이메일 직접입력, 선택하세요 유효성 검사.

- 서블릿

String eMailSite = request.getParameter("eMailSite");

String eMailForm = request.getParameter("eMailForm");

String test = "직접입력";

if (test.equals(request.getParameter("eMailForm"))) {

eMail += "@" + eMailSite;

} else

eMail += "@" + eMailForm;

 

-JSP 

<tr>

<td bgcolor = "#f2f2f2">이메일</td>

<td><input type="text" name="eMail"> @ <input type="text" name="eMailSite" value = "" disabled>

<select id="eMailForm" name="eMailForm" size="1" onchange="email_check()">

<option value="선택하세요" >선택하세요</option>

<option id="9" >직접입력</option>

<option value="naver.com" >naver.com</option>

<option value="hanmail.net" >hanmail.net</option>

<option value="daum.net" >daum.net</option>

<option value="nate.com" >nate.com</option>

<option value="samsung.com" >samsung.com</option>

<option value="gmail.com" >gmail.com</option>

</select></td>

</tr>

 

 

-Javascript

function email_check() {

if (document.frm.eMailForm.options[document.frm.eMailForm.selectedIndex].value == "선택하세요") {

document.frm.eMailSite.disabled = true;

document.frm.eMailSite.value = "";

}

if (document.frm.eMailForm.options[document.frm.eMailForm.selectedIndex].id == "9") {

document.frm.eMailSite.disabled = false;

document.frm.eMailSite.value = "";

document.frm.eMailSite.focus();

} else {

document.frm.eMailSite.disabled = true;

document.frm.eMailSite.value=

document.frm.eMailForm.options[document.frm.eMailForm.selectedIndex].value;

}

}

 

댓글