HTML에서 간단한 회원정보를 입력 받은 후 입력 받은 정보를 JSP로 처리하여 출력해 보겠다.
HTML 코드는 다음과 같다.
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<link rel="stylesheet" type="text/css" href="../css/bootstrap.min.css">
<title>Insert title here</title>
<style type="text/css">
table {
padding: 0;
border-collapse: collapse;
}
input {
border: 0;
width: 400px;
}
.ch{
width: 10px;
}
.btn{
width: 60px;
background-color: lightgray;
}
textarea{
border: 0;
margin: 0;
height: 100%;
}
</style>
</head>
<body>
<div class="container-md mt-5 text-center">
<h3>회원정보</h3>
<form action="../jsp/jsp5.jsp" method="get">
<table border="1" class="mt-3" style="margin: 0 auto;">
<tr>
<td>아 이 디</td><td><input type="text" name="id"></td>
</tr>
<tr>
<td>비밀번호</td><td><input type="password" name="pw"></td>
</tr>
<tr>
<td>비밀번호 확인</td><td><input type="password" name="pw2"></td>
</tr>
<tr>
<td>취미</td>
<td align="left">
<input class="ch" type="checkbox" name="hobby" value="climbing">등산
<input class="ch" type="checkbox" name="hobby" value="sports">운동
<input class="ch" type="checkbox" name="hobby" value="reading">독서
<input class="ch" type="checkbox" name="hobby" value="coding">코딩
</td>
</tr>
<tr>
<td>종 교</td>
<td align="left">
<select name="religion">
<option value="buddhism">불교
<option value="atheism">무교
<option value="christaianity">기독교
<option value="catholicism">천주교
</select>
</td>
</tr>
<tr>
<td>자기소개</td>
<td>
<textarea rows="10" cols="49" name="introduction"></textarea>
</td>
</tr>
<tr>
<td colspan="2">
<input class="btn" type="submit" value="전송">
<input class="btn" type="reset" value="취소">
</td>
</tr>
</table>
</form>
</div>
</body>
</html>
form태그안에 table태그로 회원정보창을 구성한 후, input태그로 정보를 입력받을수 있는 구성이다. input 태그안에 name 속성 값으로
JSP에서 값을 직접 받아 처리한다.
form 태그 action속성에 JSP파일 경로(절대경로,상대경로)를 입력하여 JSP로 데이터를 받을수 있게 한다.
HTML페이지 출력화면이다.
입력 받은 정보를 출력할 JSP 코드이다.
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
<%
request.setCharacterEncoding("utf-8");
String id = request.getParameter("id");
String pw = request.getParameter("pw");
String[] hobby = request.getParameterValues("hobby");
String[] religion = request.getParameterValues("religion");
String introduction = request.getParameter("introduction");
response.setContentType("text/html;charset=utf-8");
%>
아 이 디 : <%=id %><p>
비밀번호 : <%=pw %><p>
취 미:
<%
for(int i=0; i<hobby.length; i++){
if(i<hobby.length-1) {
out.print(hobby[i]+",");
} else {
out.print(hobby[i]);
}
}
%><p>
종 교:
<%
for(int i=0; i<religion.length; i++){
if(i<religion.length-1) {
out.print(religion[i]+",");
} else {
out.print(religion[i]);
}
}
%><p>
자기소개: <%=introduction %>
</body>
</html>
getParameter 메소드로 HTML 속성값을 받아온 후 출력하는 방식이다.(설명이 매우 불친절하다고 느낄만하다,.. 아직 제대로된 작동원리까지는 구체적으로 알지 못한다..)
HTML페이지에서 값을 입력하여 넣은 다음 전송버튼을 누르면 이렇게 입력받은 정보가 출력된다.
'JAVA > JSP' 카테고리의 다른 글
Redirect와 Forward (0) | 2023.05.13 |
---|---|
JSP Enumeration 이용해서 입력받은 정보 한번에 출력하기 (2) | 2023.05.11 |
request, response 객체정리 (1) | 2023.05.11 |
servlet 작성법 (0) | 2023.05.10 |
JSP(Java Server Pages) 기본 개념 (0) | 2023.05.10 |
댓글