본문 바로가기

Servlet&JSP

Step04_Final(jstl)

JSTL의 정식 명칭은 자바서버 페이지 표준 태그 라이브러리(JavaServer Pages Standard Tag Library)이고 줄여서 JSTL이라 부른다.

HTML 코드 내에 java 코드인 <%= %>를 ${}로, <%=if %>문을 <c:if>, <%=for%>문을 <c:forEach>로 대체하여 사용한다.

 

JSTL core의 태그

<c:set> 변수명에 값을 할당
<c:out> 값을 출력
<c:if> 조건식에 해당하는 블럭과 사용될 scope설정
<c:choose> 다른 언어의 switch와 비슷
<c:when> switch문의 case에 해당
<c:otherwise> switch문의 default에 해당
<c:forEach> 다른언어의 loop문 items 속성에 배열을 할당할 수 있음

 

EL의 객체

EL의 정식 명칭은 표현 언어(Expression Language)라고 하며 줄여서 EL이라고 부른다.

${pageScope} page Scope에 접근하기 위한 객체
${reqeustScope} request Scope에 접근하기 위한 객체
${sessionScope} session Scope에 접근하기 위한 객체
${applicationScope} application Scope에 접근하기 위한 객체
${param} 파라미터 값을 가져오기 위한 객체
${header} 헤더 값을 가져오기 위한 객체
${cookie} 쿠키 값을 가져오기 위한 객체
${initParam} JSP 초기 파라미터를 가져오기 위한 객체
${pageContext} pageContext 객체에 접근하기 위한 객체

 

EL의 연산자 종류 및 표현법

> gt
>= ge
< lt
<= le
== eq
!= ne
|| or
&& and

 

 

jstl 사용

<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>

해당 코드를 작성해야 jstl을 사용가능하다.

<%@taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt" %>

문자, 숫자 출력 할때 fmt(포멧팅) 에 관련한 라이브러리를 사용한다

 

hello.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>  
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>    
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>/test_jstl/hello.jsp</title>
</head>
<body>

	<c:forEach var="i" begin="0" end="9" step="1">
		<p>안녕 ${i }</p>
	</c:forEach>
	
	<%for(int i=0; i<=9 ; i++){ %>
		<p>안녕 <%=i %></p>
	<%} %>
</body>
</html>

두 코드가 같은 결과를 출력한다. 즉 jstl 문법으로 작성한 forEach 문이 java의 for문과 같게 동작한다.

 

 

test01.jsp

</c:forEach></c:forEach>

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>    
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>/test_jstl/test01.jsp</title>
</head>
<body>
	<h1>JSTL (Jsp Standard Tag Library)</h1>
	<c:forEach var="i" begin="1" end="5">
		<p>안녕 ${i }</p>
	</c:forEach>
</body>
</html>

 

 

test02.jsp

forEach 문의 varStatus 활용

<%@page import="java.util.ArrayList"%>
<%@page import="java.util.List"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>  
<%
	//테스트를 위해 sample 데이터를 request scope 에 담는다.
	List<String> names=new ArrayList<String>();
	names.add("김구라");
	names.add("해골");
	names.add("원숭이");
	
	request.setAttribute("list", names);
%>  
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>/test_jstl/test02.jsp</title>
</head>
<body>
	<%
		List<String> list=(List<String>)request.getAttribute("list");
	%>
	<h1>친구 목록</h1>
	<ul>
		<%for(String tmp:list){ %>
			<li><%=tmp %></li>
		<%} %>
	</ul>
	
	<h1>친구 목록</h1>
	<ul>
		<c:forEach var="tmp" items="${list }">
			<li>${tmp }</li>
		</c:forEach>
	</ul>
	
	<h1>친구 목록 입니다. 인덱스 표시</h1>
	<ul>
		<c:forEach var="tmp" items="${list }" varStatus="status">
			<li>${tmp } <strong>${status.index }</strong></li>
		</c:forEach>
	</ul>
	
	<h1>친구 목록 입니다. 순서표시</h1>
	<ul>
		<c:forEach var="tmp" items="${list }" varStatus="status">
			<li>${tmp } <strong>${status.count }</strong></li>
		</c:forEach>
	</ul>	
	
	<h1>친구 목록 입니다. 첫번째 인지 여부</h1>
	<ul>
		<c:forEach var="tmp" items="${list }" varStatus="status">
			<li>${tmp } <strong>첫번째 : ${status.first}</strong></li>
		</c:forEach>
	</ul>
	
	<h1>친구 목록 입니다. 마지막 인지 여부</h1>
	<ul>
		<c:forEach var="tmp" items="${list }" varStatus="status">
			<li>${tmp } <strong>마지막 : ${status.last}</strong></li>
		</c:forEach>
	</ul>
</body>
</html>

친구 목록

  • 김구라
  • 해골
  • 원숭이

친구 목록

  • 김구라
  • 해골
  • 원숭이

친구 목록 입니다. 인덱스 표시

  • 김구라 0
  • 해골 1
  • 원숭이 2

친구 목록 입니다. 순서표시

  • 김구라 1
  • 해골 2
  • 원숭이 3

친구 목록 입니다. 첫번째 인지 여부

  • 김구라 첫번째 : true
  • 해골 첫번째 : false
  • 원숭이 첫번째 : false

친구 목록 입니다. 마지막 인지 여부

  • 김구라 마지막 : false
  • 해골 마지막 : false
  • 원숭이 마지막 : true

 

 

test03.jsp

forEach 문의 dto 표현

<%@page import="java.util.ArrayList"%>
<%@page import="test.file.dto.FileDto"%>
<%@page import="java.util.List"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>  
<%
	//Servlet 단에서 담은 sample  데이터라고 가정하자
	List<FileDto> list=new ArrayList<>();
	FileDto dto1=new FileDto();
	dto1.setNum(1);
	dto1.setWriter("김구라");
	dto1.setTitle("제목1");
	
	FileDto dto2=new FileDto();
	dto2.setNum(2);
	dto2.setWriter("해골");
	dto2.setTitle("제목2");
	
	FileDto dto3=new FileDto();
	dto3.setNum(3);
	dto3.setWriter("원숭이");
	dto3.setTitle("제목3");
	
	list.add(dto1);
	list.add(dto2);
	list.add(dto3);
	// EL 로 추출할수 있도록 request  영역에 담는다. 
	request.setAttribute("list", list);
%>  
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>/test_jstl/test03.jsp</title>
</head>
<body>
	<h1>List 에 들어 있는 Dto 활용</h1>
	<table>
		<thead>
			<tr>
				<th>번호</th>
				<th>작성자</th>
				<th>제목</th>
			</tr>
		</thead>
		<tbody>
			<c:forEach var="tmp" items="${list }">
				<tr>
					<td>${tmp.num }</td>
					<td>${tmp.writer }</td>
					<td>${tmp.title }</td>
				</tr>
			</c:forEach>
		</tbody>
	</table>
</body>
</html>

 

 

test04.jsp

if 문과 choose, when, otherwise

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>  
<%
	// test 를 위해 sample data 를 request 영역에 담기
	request.setAttribute("jumsu", 75);
%>  
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>/test_jstl/test04.jsp</title>
</head>
<body>
	<c:if test="${ 10%2 eq 0 }">
		<p>10 은 짝수 입니다.</p>
	</c:if>
	<c:if test="${ 11%2 eq 0 }">
		<p>11 은 짝수 입니다.</p>
	</c:if>
	<c:if test="${jumsu%2 eq 0 }">
		<p>${jumsu } 는 짝수 입니다.</p>
	</c:if>
	
	<p> 획득한 점수는 <strong>${jumsu }</strong> 입니다.</p>
	<p>
		따라서 이번 학기 학점은
		<c:choose>
			<c:when test="${jumsu ge 90 }">A</c:when>
			<c:when test="${jumsu ge 80 }">B</c:when>
			<c:when test="${jumsu ge 70}">C</c:when>
			<c:when test="${jumsu ge 60 }">D</c:when>
			<c:otherwise>F</c:otherwise>
		</c:choose>
		입니다
	</p>
	<p>
		<strong>${jumsu }</strong> 는
		<c:choose>
			<c:when test="${jumsu%2 eq 0}">
				짝수
			</c:when>
			<c:otherwise>
				홀수
			</c:otherwise>
		</c:choose>
		입니다.
	</p>
	
	<%
		String id=(String)session.getAttribute("id");
	%>
	
	<%if(id == null){ %>
		<p> 로그인이 필요 합니다.</p>
	<%}else{ %>
		<p> <strong><%=id %></strong> 님 로그인중...</p>
	<%} %>
	
	<c:choose>
		<c:when test="${ empty id }">
			<p>로그인이 필요 합니다.</p>
		</c:when>
		<c:otherwise>
			<p> <strong>${id }</strong> 님 로그인중...</p>
		</c:otherwise>
	</c:choose>
</body>
</html>

 

test05.jsp

문자, 숫자 출력 할때 fmt(포멧팅) 에 관련한 라이브러리를 사용한다

fmt:formatNumber 를 사용해서 숫자를 원하는 형식으로 표현할 수 있다.

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt" %>    
<%
	//sample 데이터
	request.setAttribute("size", 123456789);
	request.setAttribute("price", 2500000);
%>    
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>test05.jsp</title>
</head>
<body>
	<p>
		파일의 크기는 
		<fmt:formatNumber value="123456789" pattern="#,###"/>
		byte 입니다.
	</p>
	<p>
		파일의 크기는 
		<fmt:formatNumber value="${size }" pattern="#,###"/>
		byte 입니다.
	</p>
	<p>
		가격은
		<fmt:formatNumber value="2500000" type="currency"/>
		입니다.
	</p>
	<p>
		가격은
		<fmt:formatNumber value="${price }" type="currency"/>
		입니다.
	</p>
	<p>
		가격은
		<fmt:formatNumber value="${price }" type="currency" currencySymbol="$"/>
		입니다.
	</p>
</body>
</html>

<%@taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt" %>

문자, 숫자 출력 할때 fmt(포멧팅) 에 관련한 라이브러리를 사용한다

 

fmt:formatNumber을 활용하여 숫자를 원하는 형식으로 표현할 수 있다. 

value값에 원하는 값을 바로 넣을 수도 있고 request.setAttributefh 로 key 값을 만들어 key값을 통해 사용할 수도 있다.

pattern을 활용해서 원하는 표현 패턴을 설정할 수 있다.

type을 활용해 숫자 표현 타입을 결정할 수 있다.

 

예시에서 사용한 currency는 통화를 나타내는 타입이다.

예시에서 value="2500000"과 type="currency"만 작성했음에도 ₩2,500,000 으로 표시되었다

currencySymbol을 사용해서 통화 표기를 바꿀 수 있다.

 

 

test06.jsp

c:forTokens 

문자열을 특정 기호로 잘라내어 반복할 수 있는 태그이다. delims에 분리할 기준 문자열을 넣어 사용한다.

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%> 
<%
	//sample 데이터
	request.setAttribute("hobby", "game/programming/piano");
	request.setAttribute("friends", "김구라,해골,원숭이");
%>    
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>/test_jstl/test06.jsp</title>
</head>
<body>
	<h1>forTokens 활용</h1>
	<h2>취미 목록</h2>
	<ul>
		<c:forTokens var="tmp" items="${hobby }" delims="/">
			<li>${tmp }</li>
		</c:forTokens>
	</ul>
	<h2>친구 목록</h2>
	<ul>
		<c:forTokens var="tmp" items="${friends }" delims=",">
			<li>${tmp }</li>
		</c:forTokens>
	</ul>
</body>
</html>

request.setAttribute에서 저장해 놓은 다수의 value를 delims 로 구분하여 분리해서 사용한다

 

 

test07.jsp 

JSTL function

fn:contains(msg,'')  : 해당 단어가 포함되어 있는지 여부

fn:escapeXml : xml 형식을 벗어나서 표현해준다.

fn:replace : 원하는 문자열을 바꾸어서 출력한다. (newLine으로 개행기호를 지칭 가능하다.)

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>  
<%@taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn" %>  
<%
	//sample 데이터
	request.setAttribute("msg", "abcde구라1234");
	request.setAttribute("str", "<div></div> 는 문단을 나타내는 요소 입니다.");
	request.setAttribute("content", "하나\n두울\n세엣");
	request.setAttribute("newLine", "\n");
%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>/test_jstl/test07.jsp</title>
</head>
<body>
	<h1>JSTL function (EL 코드 블럭 안에서 사용하는 함수) 활용</h1>
	<p> "구라" 가 포함되어 있는지 여부 : ${fn:contains(msg, '구라')}</p>
	<c:if test="${fn:contains(msg,'구라') }">
		<p>메세지에 "구라" 가 포함되어 있군요!</p>
	</c:if>
	<p>${str }</p>
	<p>${fn:escapeXml(str) }</p>
	<p>${content }</p>
	<%-- content 문자열에서 개행 기호를  <br> 로 바꾸서 출력 --%>
	<p>${fn:replace(content, newLine, '<br>') }</p>
</body>
</html>

페이지 소스 보기

 

JSTL function

 

fn:contains(msg,'')

해당 단어가 포함되어 있는지 여부

boolean type을 리턴해준다.

 

fn:escapeXml

xml 형식을 벗어나서 표현해준다.

예시에서 str(<div></div> 는 문단을 나타내는 요소 입니다.) 을 그대로 출력하면 <div></div>는 html 요소로 시각적으로 보이지 않지만 fn:escapeXml 를 사용하여 출력하면 문자열로 출력되어 시각적으로 보인다.

 

fn:replace 

원하는 문자열을 바꾸어서 출력한다. (newLine으로 개행기호를 지칭 가능하다.)

웹브라우저는 개행기호를 해석하지 않기 때문에 개행기호를 <br>태그로 대신 출력하라는 코드를 작성했다

예시에서는 하나\n두울\n세엣을 변경하는 코드를 작성했다.

 

'Servlet&JSP' 카테고리의 다른 글

Step04_Final (users, 회원가입, 로그인처리)  (0) 2022.08.22
Step04_Final (fetch)  (0) 2022.08.22
Step04_Final(cookie)  (0) 2022.08.21
Step04_Final (test_el)  (0) 2022.08.21
Step04_Final (jstl 문법 비교, 로그인navbar)  (0) 2022.08.21