Form 요소 실습_HTML

2021. 12. 14. 17:03ksmart_html_css_js/HTML실습

728x90
아래의 항목을 폼요소로 구성하여 userWriteProcess.jsp페이지에 데이터를 전달하고 그 결과값 출력

항목: 회원명, 회원아이디, 회원패스워드, 회원패스워드확인,

회원이메

일, 회원주소, 회원성별, 회원 관심 교과목(java, html, css, javascript 다중 선택)

<form action="userWriteProcess.jsp" method="post">
		<table>
		<tbody>
			<tr>
				<td><label for="userName">회원명</label></td>
				<td><input type="text" name="userName" id="userName" placeholder="회원명"></td>
			</tr>
			<tr>
				<td><label for="userId">회원아이디</label></td>
				<td><input type="text" name="userId" id="userId" placeholder="아이디"></td>
			</tr>
			<tr>
				<td><label for="userPw">회원패스워드</label></td>
				<td><input type="password" name="userPw" id="userPw" placeholder="패스워드"></td>
			</tr>
			<tr>
				<td><label for="userPwCheck">회원패스워드 확인</label></td>
				<td><input type="password" name="userPwCheck" id="userPwCheck" placeholder="패스워드 확인"></td>
			</tr>
			<tr>
				<td><label for="userEmail">회원 이메일</label></td>
				<td><input type="text" name="userEmail" id="userEmail" placeholder="회원 이메일"></td>
			</tr>
			<tr>
				<td><label for="userAddr">회원 주소</label></td>
				<td><input type="text" name="userAddr" id="userAddr" placeholder="주소"></td>
			</tr>
			<tr>
				<td>성별</td>
				<td>
					<label><input type="radio" name="userGender" value="남"> 남</label>
					<label><input type="radio" name="userGender" value="여"> 여</label>						
				</td>
			</tr>
			<tr>
				<td>관심 교과목</td>
				<td>
					<label><input type="checkbox" name="userSubject" value="java"> java</label>
					<label><input type="checkbox" name="userSubject" value="html"> html</label>						
					<label><input type="checkbox" name="userSubject" value="css"> css</label>						
					<label><input type="checkbox" name="userSubject" value="javascript"> javascript</label>						
				</td>
			</tr>
		</tbody>
		</table>		
		<button type="submit">전송</button>	
	</form>

 

답_userWriteProcess.jsp
<%
	request.setCharacterEncoding("UTF-8");
	String userName = request.getParameter("userName");
	String userId = request.getParameter("userId");
	String userPw = request.getParameter("userPw");
	String userEmail = request.getParameter("userEmail");
	String userAddr = request.getParameter("userAddr");
	String userGender = request.getParameter("userGender");
	String[] userSubject = request.getParameterValues("userSubject");
	
	/*
		System.out.println - 콘솔에 출력
		out.println - 화면에 출력
	*/
	System.out.println("userName : " + userName);
	System.out.println("userId : " + userId);
	System.out.println("userPw : " + userPw);
	System.out.println("userEmail : " + userEmail);
	System.out.println("userAddr : " + userAddr);
	System.out.println("userGender : " + userGender);
	System.out.println("userSubject : " + userSubject);
	
	out.println("userName : " + userName);
	out.println("userId : " + userId);
	out.println("userPw : " + userPw);
	out.println("userEmail : " + userEmail);
	out.println("userAddr : " + userAddr);
	out.println("userGender : " + userGender);
	out.println("userSubject : " + userSubject);

%>
728x90

'ksmart_html_css_js > HTML실습' 카테고리의 다른 글

CSS 속성 종류 및 float 실습_CSS  (0) 2021.12.15
HTML실습CSS 선택자 및 CSS 속성 종류 실습_CSS  (0) 2021.12.15
속성 종류 실습_CSS  (0) 2021.12.15
선택자 실습_CSS  (0) 2021.12.15
CSS 적용 실습_CSS  (0) 2021.12.14