[jsp] <c:set> 태그를 이용한 실습 - 1

hoonak·2023년 6월 24일
0

JSP

목록 보기
8/12

jsp에서 변수를 사용하려면 자바 코드에서 선언함. 그러나 c:set 태그를 이용하면 변수를 대체할 수 있음.

변수 선언 형식

<c:set var = "변수이름" value = "변수값" [scope = "scope 속성 중 하나"] />

여기서 var은 변수 이름을, value는 변수에 저장할 값을 scope는 변수 스코프를 지정함(page, request, session, application 중 하나).

예 1)

상단에 taglib 디렉티브 태그를 선언하고 c:set 태그를 이용해 회원 정보를 저장하는 변수를 선언한 후 값을 초기화함. 이때 c:set 태그의 value 속성은 표현 언어로 값을 설정할 수 있음. 그리고 표현 언어에서 변수 이름을 사용해 값을 출력함.

  • member1.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8"
    isELIgnored="false"
    pageEncoding="UTF-8" %>
<!-- core 태그 라이브러리를 사용하기 위해 반드시 선언해야 함. -->
<%@ taglib prefix = "c" uri = "http://java.sun.com/jsp/jstl/core" %>
<%
	request.setCharacterEncoding("utf-8");
%>
<!-- c:set 태그를 이용해 변수를 선언함. value 속성에는 표현 언어를 사용해서 초기화 할 수 있음. -->
<c:set var = "id" value = "hong" scope = "page" /> 
<c:set var = "pwd" value = "1234" scope = "page" />
<c:set var = "name" value = "${'홍길동' }" scope = "page" />
<c:set var = "age" value = "${22 }" scope	= "page" />
<c:set var = "height" value = "${177 }" scope = "page" />
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>

	<table border = "1" align = "center">
		<tr align = "center" bgcolor = "lightgreen">
			<td width = "7%"><b>아이디</b></td>
			<td width = "7%"><b>비밀번호</b></td>
			<td width = "7%"><b>이름</b></td>
			<td width = "7%"><b>이메일</b></td>
			<td width = "7%"><b>주소</b></td>
		</tr>
		<tr align = "center">
			<!-- 표현 언어로 변수에 접근하여 값을 출력함. -->
			<td>${id }</td>
			<td>${pwd }</td>
			<td>${name }</td>
			<td>${age }</td>
			<td>${height }</td>
		</tr>
	</table>

</body>
</html>

예 2)

이번에는 c:set 태그를 이용해 너무 길어서 사용하기 불편한 변수나 속성 이름을 간결하게 만들어 보겠음. 먼저 jsp a 태그를 이용해 다른 페이지로 이동하는 방법임. 지금까지는 표현 언어로 pageContext.request.contextPath 같은 긴 속성을 그대로 사용했는데, c:set 태그를 이용하면 긴 이름의 속성이나 변수를 줄여서 사용할 수 있음.

<a href = "${pageContext.request.contextPath}/memberForm.jsp">회원가입하기</a> 

로그인창에서 회원 가입창으로 이동할 때 미리 c:set 태그를 이용해 pageContext.request.contextPath 속성 이름을 contextPath로 줄여서 사용하고 있음. 복잡한 웹 페이지에서 속성 이름을 짧게 줄이면 코드의 가독성이 좋아짐.

  • login.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8"
    isELIgnored="false"
    pageEncoding="UTF-8"%>
<%@ taglib prefix = "c" uri = "http://java.sun.com/jsp/jstl/core" %>
<!-- c:set 태그 이용해 pageContext 내장 객체의 컨텍스트 이름을 변수 contextPath에 미리 설정함. -->
<c:set var = "contextPath" value = "${pageContext.request.contextPath }"/>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>

	<form action = "result.jsp">
		아이디 : <input type = "text" size = "20"/><br>
		비밀번호 : <input type = "password" size = "20" /><br>
		<input type = "submit" value = "로그인"/>
		<input type = "reset" value = "다시입력"/>
	</form>
	<br><br>
	<!-- 
	<a href = "${pageContext.request.contextPath }/memberForm.jsp">회원가입하기</a>
	 -->
	 <!-- 긴 내장 객체의 속성을 사용할 필요 없이 간단한 변수 이름으로 컨텍스트 이름을 설정함. -->
	 <a href = "${contextPath }/test03/memberForm.jsp">회원가입하기</a>
</body>
</html>

예 3)

이번에는 c:set 태그를 이용해 바인딩된 속성 이름이 긴 경우 더 짧은 변수로 대체해서 사용하는 방법. HashMap에 저장된 ArrayList의 MemberBean 속성을 출력하는 표현 언어임.

${membersMap.membersList[0].id}

속성 이름이 길면 사용하기가 불편하고 가독성도 떨어짐. 그래서 미리 c:set 태그를 이용해 사용하기 편리한 이름인 membersList로 설정한 후 인덱스를 이용해 회원 정보를 출력.

  • member2.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8"
	import = "java.util.*, sec01.ex01.*"
	isELIgnored="false"
    pageEncoding="UTF-8"%>
<%@ taglib prefix = "c" uri = "http://java.sun.com/jsp/jstl/core" %>
<%
	request.setCharacterEncoding("utf-8");
%>
	<jsp:useBean id = "membersList" class = "java.util.ArrayList"/>
	<jsp:useBean id = "membersMap" class = "java.util.HashMap"/>
<%
	membersMap.put("id", "park2");
	membersMap.put("pwd", "4321");
	membersMap.put("name", "박지성");
	membersMap.put("email", "park@test.com");
	MemberBean m1 = new MemberBean("son", "1234", "손흥민", "son@test.com");
	MemberBean m2 = new MemberBean("ki", "4321", "기성용", "ki@test.com");
	membersList.add(m1);
	membersList.add(m2);
	membersMap.put("membersList", membersList);
%>
<!-- c:set 태그를 이용해 HashMap에 저장된 ArrayList에 접근하기 위해 사용하기 편리한 이름으로 설정함. -->
<c:set var = "membersList" value = "${membersMap.membersList }" />
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>

	<table border = "1" align = "center">
		<tr align = "center" bgcolor = "#99ccff">
			<td width = "20%"><b>아이디</b></td>
			<td width = "20%"><b>비밀번호</b></td>
			<td width = "20%"><b>이름</b></td>
			<td width = "20%"><b>이메일</b></td>
		</tr>
		<tr align = "center">
			<td>${membersMap.id }</td>
			<td>${membersMap.pwd }</td>
			<td>${membersMap.name }</td>
			<td>${membersMap.email }</td>
		</tr>
		<tr align = "center">
			<!-- c:set 태그로 설정한 변수 이름으로 접근하여 출력함. -->
			<td>${membersList[0].id }</td>
			<td>${membersList[0].pwd }</td>
			<td>${membersList[0].name }</td>
			<td>${membersList[0].email }</td>
		</tr>
		<tr align = "center">
			<!-- c:set 태그로 설정한 변수 이름으로 접근하여 출력함. -->
			<td>${membersList[1].id }</td>
			<td>${membersList[1].pwd }</td>
			<td>${membersList[1].name }</td>
			<td>${membersList[1].email }</td>
		</tr>
	</table>

</body>
</html>

<c:remove> 태그를 이용한 실습

jsp 페이지에서 변수를 선언했으면 c:remove 태그를 이용해 변수를 제거할 수도 있음.

형식

<c:remove var = "변수이름" [scope = "scope 속성 중 하나"]/>

여기서 var는 제거할 변수 이름을, scope는 변수 범위(scope)를 지정함(page, request, session, application 중 하나).

예 1)

  • member3.jsp

c:remove 태그를 이용해 c:set으로 선언한 변수를 삭제함.

<%@ page language="java" contentType="text/html; charset=UTF-8"
    isELIgnored="false"
    pageEncoding="UTF-8"%>
<%@ taglib prefix = "c" uri = "http://java.sun.com/jsp/jstl/core" %>
<%
	request.setCharacterEncoding("utf-8");
%>
<c:set var = "id" value = "hong" scope = "page"/>
<c:set var = "pwd" value = "1234" scope = "page"/>
<c:set var = "name" value = "${'홍길동' }" scope = "page"/>
<c:set var = "age" value = "${22 }" scope = "page"/>
<c:set var = "height" value = "${177 }" scope = "page"/>
<!-- 변수 age와 height를 삭제함. -->
<c:remove var = "age"/>
<c:remove var = "height"/>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>

	<table align = "center" border = "1">
		<tr align = "center" bgcolor = "lightgreen">
			<td width = "7%"><b>아이디</b></td>
			<td width = "7%"><b>비밀번호</b></td>
			<td width = "7%"><b>이름</b></td>
			<td width = "7%"><b>나이</b></td>
			<td width = "7%"><b></b></td>
		</tr>
		<tr align = "center">
			<td>${id }</td>
			<td>${pwd }</td>
			<td>${name }</td>
			<td>${age }</td>
			<td>${height }</td>
		</tr>
	</table>

</body>
</html>


c:remove 태그를 이용해 변수 age와 height를 삭제했기 때문에 아무 값도 출력되지 않음.

<c:if> 태그를 이용한 실습

c:if 태그는 이름에서도 알 수 있듯이 jsp 페이지에서 조건문을 대체해 사용하는 태그이며, 사용 형식은 다음과 같음.

<c:if test = "${조건식}" var = "변수이름" [scope = "scope 속성 중 하나"]/>

...

</c:if>

여기서 test는 표현 언어를 이용해 수행할 조건식 위치를 var은 조건식의 결괏값을 저장함. 또한 scope는 변수의 스코프를 지정(page, request, session, application 중 하나)함.

  • member4.jsp

c:if 태그의 test 속성에는 표현 언어 안에 비교 연산자나 논리 연산자로 조건식을 수행함.

<%@ page language="java" contentType="text/html; charset=UTF-8"
    isELIgnored="false"
    pageEncoding="UTF-8"%>
<%@ taglib prefix = "c" uri = "http://java.sun.com/jsp/jstl/core" %>
<%
	request.setCharacterEncoding("utf-8");
%>
<c:set var = "id" value = "hong" scope = "page"/>
<c:set var = "pwd" value = "1234" scope = "page"/>
<c:set var = "name" value = "${'홍길동' }" scope = "page"/>
<c:set var = "age" value = "${22 }" scope = "page"/>
<c:set var = "height" value = "${177 }" scope = "page"/>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>

	<c:if test = "${true }">
		<h1>항상 참입니다.</h1>
	</c:if>
	
	<c:if test = "${11 == 11 }">
		<h1>두 값은 같습니다.</h1>
	</c:if>
	
	<c:if test = "${11 != 31 }">
		<h1>두 값은 같지 않습니다.</h1>
	</c:if>
	
	<c:if test = "${(id == 'hong') && (name == '홍길동') }">
		<h1>아이디는 ${id }이고, 이름은 ${name }입니다.</h1>
	</c:if>
	
	<c:if test = "${age == 22 }">
		<h1>${name }의 나이는 ${age }살입니다.</h1>
	</c:if>
	
	<c:if test = "${height > 160}">
		<h1>${name }의 키는 160보다 큽니다.</h1>
	</c:if>
	
</body>
</html>

<c:choose> 태그를 이용한 실습

c:choose 태그는 jsp 페이지에서 switch문의 기능을 수행하며, 사용 형식은 다음과 같음.

<c:choose>
	<c:when test = "조건식1">본문내용</c:when>
    <c:when test = "조건식2">본문내용</c:when>
    ...
    <c:otherwise>본문내용n</c:otherwise>
</c:choose>

첫 번째 c:when 태그의 조건식 1을 체크해서 참이면 본문내용 1을 수행하고 만약 거짓이면 다음 c:when의 조건식2를 체크해서 참이면 본문내용2를 수행함. 모든 조건이 거짓이면 c:otherwise 태그의 본문내용을 수행함.

  • member5.jsp

c:choose 태그를 이용해 name 값의 유무에 따라 다른 결과를 표시함. 만약 name 값이 정상적이면 회원 정보를 출력하고 name이 null이거나 빈 문자열이면 오류 메시지를 출력함.

<%@ page language="java" contentType="text/html; charset=UTF-8"
    isELIgnored="false"
    pageEncoding="UTF-8"%>
<%@ taglib prefix = "c" uri = "http://java.sun.com/jsp/jstl/core" %>
<%
	request.setCharacterEncoding("utf-8");
%>
<c:set var = "id" value = "hong" scope = "page"/>
<c:set var = "pwd" value = "1234" scope = "page"/>
<c:set var = "name" value = "${'홍길동' }" scope = "page"/>
<c:set var = "age" value = "${22 }" scope = "page"/>
<c:set var = "height" value = "${177 }" scope = "page"/>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>

	<table align = "center" border = "1">
		<tr align = "center" bgcolor = "lightgreen">
			<td width = "7%"><b>아이디</b></td>
			<td width = "7%"><b>비밀번호</b></td>
			<td width = "7%"><b>이름</b></td>
			<td width = "7%"><b>나이</b></td>
			<td width = "7%"><b></b></td>
		</tr>
	 	<c:choose>
		 	<!-- <c:when test = "${name == null }"> -->
			<c:when test = "${empty name }"> <!-- 변수 name이 null이거나 빈 문자열인지 체크함. -->
				<tr align = "center">
					<td colspan = "5">이름을 입력하세요.</td>
				</tr>
			</c:when>
			<!-- name이 정상적이면 회원 정보를 출력함. -->
			<c:otherwise>
				<tr align = "center">
					<td>${id }</td>
					<td>${pwd }</td>
					<td>${name }</td>
					<td>${age }</td>
					<td>${height }</td>
				</tr>
			</c:otherwise>
	</c:choose>
	</table>

</body>
</html>

이번에는 다음과 같이 name 변수를 주석 처리함.


재요청 시 오류 메시지를 출력함.

profile
Hello World!

0개의 댓글