Servlet / JSP ) 15. JSTL

60jong·2022년 7월 7일
0

Servlet / JSP

목록 보기
15/17

Server 공부 흐름

Servlet --HTML코드 출력 문제--> JSP --스파게티 코드 문제--> [JSP MVC] -> Spring MVC -> SpringBoot


JSTL (Java Standard Tag Library)

list.jsp를 JSP MVC model2 방식으로 바꾸었는데, 여전히 코드 블록을 통해 for문으로 흐름을 제어해야했다.
이를 해결하기 위해 JSTL (Java Standard Tag Library) 을 사용해보자.

JSP 페이지 내에서 자바 코드를 바로 사용하지 않고 로직을 내장하는 효율적인 방법을 제공

  • 접두사 c는 "core"의 약자로 자주 사용

  • 접두사 fmt는 "formatting"의 약자로 자주 사용

  • 접두사 fn는 "functions"의 약자로 자주 사용

JSTL ...core

<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
  • 태그 모음
태그기능
<c:set />변수의 선언
<c:remove /> 변수의 제거
<c:out /> 변수의 출력 
<c:catch />예외 처리
<c:if /> 조건문 (else는 없다) 
<c:choose /> Switch문과 비슷 
<c:when />Switch문과 비슷
<c:otherwise />Switch문과 비슷
<c:forEach /> 반복문
<c:forTokens />구분자로 분할하여 반복문 
<c:url />URL 생성
<c:param /> 파라미터 추가
<c:import />페이지 첨부
<c:redirect />URL 이동 

JSTL <c:forEach>로 흐름제어

list.jsp에서는 흐름 제어를 위해 <forEach>를 사용할 것인데, <c:forEach>를 사용해야 한다.

JSTL을 사용하기 위해서는 꼭 접두사를 사용해서 tag library가 저장된 uri를 매핑해줘야 한다.


JSTL을 이용해 list.jsp의 흐름 제어에서 코드 블록을 대체해보자.

	<c:forEach var="n" items="${noticeList}">
	<tr>
		<td>${n.id}</td>
		<td class="title indent text-align-left"><a href="detail?id=${n.id}">${n.title}</a></td>
		<td>${n.memberID}</td>
		<td>
			${n.regDate}
		</td>
		<td>${n.hit}</td>
	</tr>
	</c:forEach>
  • forEach 속성 값
    • items : 리스트 등의 객체 집합
    • var : items에서의 하나의 객체
    • begin : 시작 인덱스
    • end : 마지막 인덱스
    • varStatus : var의 상태를 저장할 객체명
      • varStatus 속성 값 | index / count / first / last
    • step : 인덱스 간격

<c:forEach var="n" items="list" begin="1" end="3" varStatus="st">
--> list 에 있는 객체 n을 인덱스 1부터 3(포함)까지 !! n의 상태값은 st에 저장



JSTL <c:set> / <c:if>로 paging

  • query string으로 전해지는 page num > p를 <c:set>을 통해 page로 저장
  • page 1~5 > 1, 6~10 > 6 ~~~ <c:set>을 통해 startNum에 저장
  • 클릭 가능한 page 5개를 <c:forEach>를 통해 구현
	<c:set var="page" value="${empty param.p ? 1 : param.p}"/>
	<c:set var="startNum" value="${page-(page-1)%5}"/>
    
    	<c:forEach var="i" begin="0" end="4">
			<li><a class="-text- orange bold" href="?p=${i+startNum}&t=&q=" >${i+startNum}</a></li>
		</c:forEach>


query string으로 p=3 전달 > page = 3 / startNum = 3-(3-1)%5 = 1 / paging --> 1 2 3 4 5



paging 양쪽에 버튼을 누르면 startNum이 1 -> 6 -> 11 -> 이렇게 5씩 변화할 것이다. 그런데,

startNum = 1 or 다음 startNum이 없다면 (리스트 끝) 메시지 박스를 띄워야 할 것이므로...

<c:set var="lastNum" value="26"/>

		~~~

 		<c:if test="${startNum <= 1}">
			<span class="btn btn-prev" onclick="alert('이전 페이지가 없습니다.');">이전</span>
		</c:if>
		<c:if test="${startNum > 1}">
			<a class="btn btn-prev" href="?p=${startNum-5}&t=&q=">이전</a>
		</c:if>

			~~~

		<c:if test="${startNum+5 > lastNum}">
			<span class="btn btn-next" onclick="alert('다음 페이지가 없습니다.');">다음</span>
		</c:if>
		<c:if test="${startNum+5 <= lastNum}">
			<a class="btn btn-next" href="?p=${startNum+5}&t=&q=">다음</a>
		</c:if>

임의로 lastNum=26으로 정해서 startNum + 5 > lastNum이면 다음 페이지가 없습니다.라고 알림을 뜨게 했다.

  • <c:if>는 test라는 속성이 필수 적인데, if-else 구문으로 작성이 불가능하기에 배타적으로 작성해야 한다!!
    (startNum + 5 >= lastNum / startNum + 5 < lastNum)

JSTL ...formatting

<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
  • 태그 모음
태그기능
requestEncodingvalue 속성을 통해 지정한 문자 셋으로 변경
setLocale통화 기호나 시간 대역을 설정한 지역에 맞게 표시
timeZone특정 영역의 시간대를 설정
setTimeZone특정 영역의 시간대 설정 정보를 변수에 저장
bundlebasename 속성에 지정된 properties 파일을 읽어옴
setBundleproperties 파일을 읽어와 다양한 영역에서 참조할 수 있게 설정
messagebundle 태그를 통해 저장된 key로 value를 가져온다
formatNumber숫자를 특정 양식에 맞추어 출력
parseNumber문자열을 숫자 형식으로 변환
formatDate날짜 정보를 가진 객체(Date)를 특정 형식으로 변호나하여 출력
parseDate문자열을 날짜 형식으로 변환하여 출력

JSTL <fmt:formatDate>로 날짜 형식 변경


2022/07/07 12:54:11 형식으로 출력하려면

<fmt:formatDate pattern="yyyy/MM/dd hh:mm:ss" value="${n.regDate}">

JSTL ...functions

<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
  • 태그 모음
태그기능
fn:contains(string, substr)string이 substr을 포함하면 return true
fn:containsIgnoreCase(string, substr)대소문자 관계없이 string이 substr을 포함하면 return true
fn:startsWith(string, prefix)string이 prefix로 시작하면 return True
fn:endsWith(string, suffix)string이 suffix로 끝나면 return True
fn:escapeXml(string)string에 XML과 HTML에서 < >& ' " 문자들이 있으면, XML엔티티 코드로 바꿔준뒤 문자열 반환
fn:indexOf(string, substr)string에서 substr이 처음으로 나타나는 인덱스 반환
fn:split(string, separator)string내의 문자열 separetor에 따라 나눈 배열로 반환
fn:join(array, separator)array요소들을 separator를 구분자로 하여 연결해서 반환
fn:length(item)item이 배열이나 컬렉션이면 요소의 개수를 문자열이면 문자의 개수를 반환
fn:replace(string, before, after)string내에 있는 before 문자열을 after 문자열로 모두 변경해서 반환
fn:substring(string, begin, end)string에서 begin인덱스에서 시작해서 end인덱스에 끝나는 부분의 문자열 반환
fn:substringAfter(string, substr)string에서 substr이 나타나는 이후의 문자열 반환
fn:substringBefore(string, substr)string에서 substr이 나타나는 이전의 문자열 반환
fn:toLowerCase(string)string을 모두 소문자로 변경 후 리턴
fn:toUpperCase(string)string을 모두 대문자로 변경 후 리턴
fn:trim(string)string앞뒤의 공백을 모두 제거한 후 반환

JSTL <fn:toUpperCase>로 제목 모두 대문자로


<fn:toUpperCase(${n.title})>
profile
울릉도에 별장 짓고 싶다

0개의 댓글