(JSP) 자바빈즈를 이용하여 회원가입 폼의 데이터를 출력하기

2020. 8. 28. 17:07ㆍJSP

package test;

public class JoinBean {

private	String userid;

private	String userpass;

private	String passcheck;

private	String useremail;

private	String username;

private	int number1;

private	int number2;

private	int year;

private	int month;

private	int day;


private String[] chk;

private String address1;

private String address2;

private String address3;

public String getUserid() {
	return userid;
}

public void setUserid(String userid) {
	this.userid = userid;
}

public String getUserpass() {
	return userpass;
}

public void setUserpass(String userpass) {
	this.userpass = userpass;
}

public String getPasscheck() {
	return passcheck;
}

public void setPasscheck(String passcheck) {
	this.passcheck = passcheck;
}

public String getUseremail() {
	return useremail;
}

public void setUseremail(String useremail) {
	this.useremail = useremail;
}

public String getUsername() {
	return username;
}

public void setUsername(String username) {
	this.username = username;
}

public int getNumber1() {
	return number1;
}

public void setNumber1(int number1) {
	this.number1 = number1;
}

public int getNumber2() {
	return number2;
}

public void setNumber2(int number2) {
	this.number2 = number2;
}

public int getYear() {
	return year;
}

public void setYear(int year) {
	this.year = year;
}

public int getMonth() {
	return month;
}

public void setMonth(int month) {
	this.month = month;
}

public int getDay() {
	return day;
}

public void setDay(int day) {
	this.day = day;
}

public String getAddress1() {
	return address1;
}

public void setAddress1(String address1) {
	this.address1 = address1;
}

public String getAddress2() {
	return address2;
}

public void setAddress2(String address2) {
	this.address2 = address2;
}

public String getAddress3() {
	return address3;
}

public void setAddress3(String address3) {
	this.address3 = address3;
}

public String[] getChk() {
	return chk;
}

public void setChk(String[] chk) {
	this.chk = chk;
}


}

Beans

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<title>회원가입 페이지</title>

<script src="https://t1.daumcdn.net/mapjsapi/bundle/postcode/prod/postcode.v2.js"></script>
 <script type="text/javascript">
	function sample6_execDaumPostcode() {
        new daum.Postcode({
            oncomplete: function(data) {
                // 팝업에서 검색결과 항목을 클릭했을때 실행할 코드를 작성하는 부분.
                // 각 주소의 노출 규칙에 따라 주소를 조합한다.
                // 내려오는 변수가 값이 없는 경우엔 공백('')값을 가지므로, 이를 참고하여 분기 한다.
                var addr = ''; // 주소 변수
                var extraAddr = ''; // 참고항목 변수
                //사용자가 선택한 주소 타입에 따라 해당 주소 값을 가져온다.
                if (data.userSelectedType === 'R') { // 사용자가 도로명 주소를 선택했을 경우
                    addr = data.roadAddress;
                } else { // 사용자가 지번 주소를 선택했을 경우(J)
                    addr = data.jibunAddress;
                }
                // 사용자가 선택한 주소가 도로명 타입일때 참고항목을 조합한다.
                if(data.userSelectedType === 'R'){
                    // 법정동명이 있을 경우 추가한다. (법정리는 제외)
                    // 법정동의 경우 마지막 문자가 "동/로/가"로 끝난다.
                    if(data.bname !== '' && /[동|로|가]$/g.test(data.bname)){
                        extraAddr += data.bname;
                    }
                    // 건물명이 있고, 공동주택일 경우 추가한다.
                    if(data.buildingName !== '' && data.apartment === 'Y'){
                        extraAddr += (extraAddr !== '' ? ', ' + data.buildingName : data.buildingName);
                    }
                    // 표시할 참고항목이 있을 경우, 괄호까지 추가한 최종 문자열을 만든다.
                    if(extraAddr !== ''){
                        extraAddr = ' (' + extraAddr + ')';
                    }
                    // 조합된 참고항목을 해당 필드에 넣는다.
                    document.getElementById("sample6_extraAddress").value = extraAddr;
                
                } else {
                    document.getElementById("sample6_extraAddress").value = '';
                }
                // 우편번호와 주소 정보를 해당 필드에 넣는다.
                document.getElementById('sample6_postcode').value = data.zonecode;
                document.getElementById("sample6_address").value = addr;
                // 커서를 상세주소 필드로 이동한다.
                document.getElementById("sample6_detailAddress").focus();
            }
        }).open();
    }
	
	function chkchk() {
		
		chk1   = number1.value.charAt(0)*2;
		chk2   = number1.value.charAt(1)*3;
		chk3   = number1.value.charAt(2)*4;
		chk4   = number1.value.charAt(3)*5;
		chk5   = number1.value.charAt(4)*6;
		chk6   = number1.value.charAt(5)*7;
		chk7   = number2.value.charAt(0)*8;
		chk8   = number2.value.charAt(1)*9;
		chk9   = number2.value.charAt(2)*2;
		chk10 = number2.value.charAt(3)*3;
		chk11 = number2.value.charAt(4)*4;
		chk12 = number2.value.charAt(5)*5;
		
		chk13 = number2.value.charAt(6);
		
		num = chk1+chk2+chk3+chk4+chk5+chk6+chk7+chk8+chk9+chk10+chk11+chk12;
		numChk = 11 - (num % 11);
		
		var checkIDPW = /^[0-9a-zA-Z]{4,12}$/;
		var checkEmail = /^[0-9a-zA-Z]([-_.]?[0-9a-zA-Z])*@[0-9a-zA-Z]([-_.]?[0-9a-zA-Z])*.[a-zA-Z]{2,4}$/;
// 		var addinfo = /^(?:[0-9]{2}(?:0[1-9]|1[0-2])(?:0[1-9]|[1,2][0-9]|3[0,1]))-[1-4][0-9]{6}$/;
		var idid = document.getElementById("idid");
        var pw  = document.getElementById("pw");
        var mail = document.getElementById("mail");
		
		if(!check(checkIDPW, idid, "ID가 올바르지 않습니다.")){
			return false;
		}
		if(!check(checkIDPW, pw, "비밀번호가 올바르지 않습니다.")){
			return false;
		}
		if (idid.value == pw.value) {
			alert("ID와 비밀번호가 같습니다.");
			return false;
		}
		if (pw.value != pwchk.value) {
			alert("비밀번호를 다시 확인하세요.");
			return false;
		}
		if (!check(checkEmail, mail, "이메일이 올바르지 않습니다.")){
			return false;
		}
		if (name1.value == "") {
			alert("이름을 입력하세요.");
			return false;
		}
		if (chk13 != numChk) {
			alert("잘못된 주민등록 번호 입니다.");
			return false;
		}else{
			var number1 = document.getElementById("number1");
			var number2 = document.getElementById("number2");
			var year = document.getElementById("year");
			var month = document.getElementById("month");
			var day = document.getElementById("day");
			if (number1.value.length > 0 || number1.value.length < 7) {
				var a1 = number1.value.substring(0, 2);//앞자리 년 
				var a2 = number1.value.substring(2, 4);//앞자리 월
				var a3 = number1.value.substring(4, 6);//앞자리 일
				var a4 = number2.value.substring(0, 1);//뒷자리 1글자   
				var total;
				//뒷번호 앞자리가 0 ,9 이면 1800년생
				if (0 == a4 || 9 == a4) {
					total = 18 + a1;
				}
				//뒷번호 앞자리가 1,2 이면 1900년생
				else if (1 == a4 || 2 == a4) {
					total = 19 + a1;
				}
				//뒷번호 앞자리가 3 ,4 이면 2000년생
				else if (3 == a4 || 4 == a4) {
					total = 20 + a1;
				}
				year.value = total;
				month.value = a2;
				day.value = a3;
			}
		}
		if (my_intro.value == "") {
			alert("자기소개를 입력하세요.");
			return false;
		}
	}
	
	function check(chks, ids ,msgs) {
		if(chks.test(ids.value)){
			return true;
		}
		alert(msgs);
		ids.value = "";
	}
	
</script>
</head>
<form action="Output.jsp" method="post">
	<audio autoplay controls>
		<source src="audio/song.mp3" type="audio/mp3">
	</audio>
	<table border="1" style="border-collapse: collapse">
		<tr>
			<th colspan="2" bgcolor="skyblue">회원 기본 정보</th>
		</tr>
		<tr>
			<th>아이디:</th>
			<td><input type="text" id="idid" size="20" minlength="4" maxlength="12" name="userid"> 4~12자의 영문 대소문자와 숫자로만 입력</td>
		</tr>
		<tr>
			<th>비밀 번호:</th>
			<td><input type="password" id="pw" size="20" minlength="4" maxlength="12" name="userpass"> 4~12자의 영문 대소문자와 숫자로만 입력</td>
		</tr>
		<tr>
			<th>비밀 번호 확인:</th>
			<td><input type="password" id="pwchk" size="20" minlength="4" maxlength="12" name="passcheck"></td>
		</tr>
		<tr>
			<th>메일 주소:</th>
			<td><input type="email" id="mail" size="25" name="useremail"> 예)YoonEui@domain.com</td>
		</tr>
		<tr>
			<th>이름:</th>
			<td><input type="text" id="name1" size="25"name="username"></td>
		</tr>
		<tr>
			<th colspan="2" bgcolor="skyblue">개인 신상 정보</th>
		</tr>
		<tr>
			<th>우편번호</th>
			<td>
				<input type="text" id="sample6_postcode" placeholder="우편번호" name="address1">
				<input type="button" onclick="sample6_execDaumPostcode()" value="우편번호 찾기"><br>
				<input type="text" id="sample6_address" placeholder="주소"  name="address2"><br>
				<input type="text" id="sample6_detailAddress" placeholder="상세주소"  name="address3">
				<input type="text" id="sample6_extraAddress" placeholder="참고항목"  name="address4">
			</td>
		</tr>
		<tr>
			<th>주민등록번호:</th>
			<td><input type="text" id="number1" size="10" name="number1"> - <input type="password" id="number2" size="10" name="number2"> 예) 123456 - 1234567
			</td>
		</tr>
		<tr>
			<th>생일:</th>
			<td><input type="text" id="year" size="10" name="year">년 <input type="text" id="month" size="5" name="month">월 <input type="text" id="day" size="5" name="day">일
			</td>
		</tr>
		<tr>
			<th>관심 분야:</th>
			<td>
				<input type="checkbox" name="chk" value="computer">컴퓨터
				<input type="checkbox" name="chk" value="internet">인터넷 
				<input type="checkbox" name="chk" value="play">여행 
				<input type="checkbox" name="chk" value="movie">영화감상 
				<input type="checkbox" name="chk" value="music">음악감상</td>
		</tr>
		<tr>
			<th>자기 소개:</th>
			<td><textarea id="my_intro" cols="60" rows="10" name="my_intro"></textarea></td>
		</tr>
	</table>
<pre>
				<input type="submit"  value="회원 가입" > <input type="reset" value="다시 입력">
</pre>
</form>
</head>
</html>

joinform

 

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%request.setCharacterEncoding("UTF-8");%>  
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
<!--객체생성  -->
<jsp:useBean id="jointest" class="test.JoinBean" scope="request"></jsp:useBean>

<!-- set -->

<jsp:setProperty name="jointest" property="userid"/>
<jsp:setProperty name="jointest" property="userpass"/>
<jsp:setProperty name="jointest" property="passcheck"/>
<jsp:setProperty name="jointest" property="useremail"/>
<jsp:setProperty name="jointest" property="username"/>
<jsp:setProperty name="jointest" property="number1"/>
<jsp:setProperty name="jointest" property="number2"/>
<jsp:setProperty name="jointest" property="year"/>
<jsp:setProperty name="jointest" property="month"/>
<jsp:setProperty name="jointest" property="day"/>
<jsp:setProperty name="jointest" property="address1"/>
<jsp:setProperty name="jointest" property="address2"/>
<jsp:setProperty name="jointest" property="address3"/>
<jsp:setProperty name="jointest" property="address3"/>
<jsp:setProperty name="jointest" property="chk"/>

<!--property 호출-->

<table border="1" style="text-align:center">
<tr>
<td colspan="3">출력결과</td>
</tr>
<tr>
<td>아이디:<jsp:getProperty name="jointest" property="userid"/></td>
</tr>
<tr>
<td>비밀번호:<jsp:getProperty name="jointest" property="userpass"/></td>
</tr>
<tr>
<td>비밀번호 확인:<jsp:getProperty name="jointest" property="passcheck"/></td>
</tr>
<tr>
<tr>
<td>이메일:<jsp:getProperty name="jointest" property="useremail"/></td>
</tr>
<tr>
<td>이름:<jsp:getProperty name="jointest" property="username"/></td>
</tr>
<tr>
<td>주민번호<jsp:getProperty name="jointest" property="number1"/>-<jsp:getProperty name="jointest" property="number2"/></td>
</tr>
<tr>
<td>
<jsp:getProperty name="jointest" property="year"/>년
<jsp:getProperty name="jointest" property="month"/>월
<jsp:getProperty name="jointest" property="day"/>일
</td>
</tr>
<tr>
<td>취미생활: 
<%for(String str : jointest.getChk() ){
	out.println(str);
};
%>
</td>
</tr>

<tr>
<td>주소:<jsp:getProperty name="jointest" property="address1"/>
<jsp:getProperty name="jointest" property="address2"/>
<jsp:getProperty name="jointest" property="address3"/></td>
<tr>



</table>
</body>
</html>

출력 부분 ( out put )

 

현재는

<jsp:setProperty name="jointest" property="address2"/>

<jsp:getProperty name="jointest" property="address2"/>

 

이런식으로 property의 값을 한번에 받았지만 

 

 

<jsp:setProperty name="jointest" property="*"/>
// 모든 property를 가져온다

<%=jointest.getName()%> 
//으로도 간결하게 출력이 가능하다

위방식으로 하면 가독성이 좋아진다.

'JSP' 카테고리의 다른 글

(JSP)파일업로드  (0) 2020.09.22
(jsp)JDBC  (0) 2020.09.21
(JSP)자바 빈즈  (0) 2020.08.28
(JSP) Scope & Attribute개념정리 action태그- include 예제  (0) 2020.08.28
(JSP) 장바구니  (0) 2020.08.27

관련글

댓글 0

티스토리툴바