실습(action Tag(include))
1. footer.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<h4>푸터 페이지 영역!</h4>
</body>
</html>
2. header.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<h4>헤더 페이지 영역!</h4>
</body>
</html>
3. includeTest.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>액션 태그 include</title>
</head>
<body>
<jsp:include page="header.jsp"/>
<h4>--------------------------------------현재 페이지 영역--------------------------------------</h4>
<jsp:include page="footer.jsp"/>
</body>
</html>

실습(action Tag(params))
1. paramResult.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>응답 페이지</title>
</head>
<body>
<p>아이디 : <%=request.getParameter("id")%></p>
<p>이름 : <%=request.getParameter("name")%></p>
</body>
</html>
2. paramTest.jsp
<%@ 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>param 액션 태그</title>
</head>
<body>
<h3>param 액션 태그</h3>
<jsp:forward page="paramResult.jsp">
<jsp:param value="admin" name="id"/>
<jsp:param value="관리자" name="name"/>
</jsp:forward>
</body>
</html>

실습(action Tag(object))
- 문제
<!--
이름과 생일이 모두 입력되었을 때 전송한다.
objectOk.jsp에서는 전달받은 이름과 생일을 출력한다.
-->
1. object.jsp
<%@ 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>내장 객체 request</title>
</head>
<body>
<form action="objectOk.jsp" name="join" method="post">
<fieldset>
<legend>개인 정보</legend>
<input type="text" name="name">
<input type="date" name="birthday">
<input type="button" value="확인">
</fieldset>
</form>
</body>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script>
const $name = $("input[name='name']");
const $birthday = $("input[name='birthday']");
$name.on("click", function(){
$(this).removeAttr("style");
$(this).removeAttr("placeholder");
})
$birthday.click(function(){
$(this).removeAttr("style");
});
$("input[type='button']").on("click", function(){
if(!$name.val()){
$name.css('border-color', 'red');
$name.attr('placeholder', '성함을 입력하세요');
return;
}
if(!$birthday.val()){
$birthday.css('border-color', 'red');
return;
}
join.submit();
});
</script>
</html>
2. objectOk.jsp
<%@ 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>회원 정보</title>
</head>
<body>
<table>
<tr>
<th>이름</th>
<th>생일</th>
</tr>
<tr>
<td><%=request.getParameter("name")%></td>
<td><%=request.getParameter("birthday")%></td>
</tr>
</table>
</body>
</html>




'웹 개발 > JSP' 카테고리의 다른 글
[Web_JSP] 07 (0) | 2022.05.26 |
---|---|
[Web_JSP] 06 (0) | 2022.05.24 |
[Web_JSP] 04 (0) | 2022.05.22 |
[Web_JSP] 03 (0) | 2022.05.18 |
[Web_JSP] 02 (0) | 2022.05.17 |