[JSP] 202320323 JSTL 구현하기

Notice

Recent Posts

Recent Comments

Link

« 2025/07 »
일	월	화	수	목	금	토
		1	2	3	4	5
6	7	8	9	10	11	12
13	14	15	16	17	18	19
20	21	22	23	24	25	26
27	28	29	30	31

Tags more

Archives

Today

Total

관리 메뉴

me made it !

[JSP] 202320323 JSTL 구현하기 본문

TIL/JSP

[JSP] 202320323 JSTL 구현하기

yeoney 2023. 3. 23. 12:30

▶ JSTL(JavaServer Pages Standard Tag Library)

자바코드를 html태그형식으로 간편하게 사용하기 위해 나온 라이브러리

JSTL은 JSP 페이지 내에서 자바 코드를 바로 사용하지 않고 로직을 내장하는 효율적인 방법을 제공한다. 표준화된 태그 셋을 사용하여 자바 코드가 들락거리는 것보다 더 코드의 유지보수와 응용 소프트웨어 코드와 사용자 인터페이스 간의 관심사의 분리로 이어지게 한다.

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>      
 <%@ page import ="java.util.*" %>
 <%@ page import ="example1230.domain.*" %>
 <%
ArrayList<BoardVo>  blist = (ArrayList<BoardVo>)request.getAttribute("blist");
 PageMaker pm =(PageMaker)request.getAttribute("pm");
 %>    
       
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>게시판 목록</title>
<style type="text/css">
a:link{
text-decoration:none;
}

</style>
</head>
<body>
게시판 목록
<form name="frm" action="<%=request.getContextPath() %>/board/boardList.do" method="post">
<table  style="text-align:left;width:800px;border:0;">
<tr>
<td style="width:600px;"></td>
<td>
<select name="searchType">
<option value="subject">제목</option>
<option value="writer">작성자</option>
</select>
</td>
<td><input type="text" name="keyword" size="10"></td>
<td><input type="submit" name="submit" value="검색"></td>
</tr>
</table>
</form>
<table border=1 style="text-align:left;width:800px;">
<tr>
<td>게시물번호</td>
<td>제목</td>
<td>작성자</td>
<td>날짜</td>
</tr>
<%for(BoardVo bv: blist){ %>
<tr>
<td>
<%=bv.getBidx() %></td>
<td>
<%for(int i = 1; i<=bv.getLevel_(); i++){
		out.println("&nbsp;&nbsp;");
		if(i==bv.getLevel_()){
			out.println("ㄴ");
		}
	
	
} %>

<a href="<%=request.getContextPath()%>/board/boardContents.do?bidx=<%=bv.getBidx() %>"><%=bv.getSubject() %></a></td>
<td><%=bv.getWriter() %></td>
<td><%=bv.getWriteday().substring(0,10)  %></td>
</tr>
<%} %>



</table>
<table style="border:0, width:300px;width:800px;">
<tr>
<td style="text-align:right;">
<%if (pm.isPrev()){ %>
<a href="<%=request.getContextPath()%>/board/boardList.do?page=<%=pm.getStartPage()-1%>&searchType=<%=pm.getScri().getSearchType()%>&keyword=<%=pm.encoding(pm.getScri().getKeyword())%>">◀</a>
<%} %>
</td>
<td style="text-align:center;width:300px;">
<%
for (int i= pm.getStartPage(); i <=pm.getEndPage(); i++){
%>
	<a href ="<%=request.getContextPath()%>/board/boardList.do?page=<%=i%>&searchType=<%=pm.getScri().getSearchType()%>&keyword=<%=pm.encoding(pm.getScri().getKeyword())%>"><%=i %></a>
<%	
}
%>
</td>
<td style="width:200px;text-align:left;">
<%if (pm.isNext()&&pm.getEndPage() > 0){ %>
<a href="<%=request.getContextPath()%>/board/boardList.do?page=<%=pm.getEndPage()+1%>&searchType=<%=pm.getScri().getSearchType()%>&keyword=<%=pm.encoding(pm.getScri().getKeyword())%>">▶</a>
<%} %>
</td>
</tr>
</table>

<a href="<%=request.getContextPath()%>/board/boardWrite.do">글쓰기</a>
</body>
</html>

▶JSP 로 만든 기본 코드를 > JSTL 로 바꾸기

먼저 이 코드를 HEADER에 추가한다

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

▶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이라고 부른다.

JSP 2.0 스펙에 새로 추가된 스크립트 언어로서 초기의 EL은 JSTL의 액션 태그에서만 작동하는 문제가 있었는데, JSP 2.0 부터는 JSP 컨테이너가 EL표현식을 해석할 수 있게 도어 표준 액션 태그, 커스텀 태그, 템플릿 데이터와 같이 자바코드를 사용해야 했던 모든 곳에 EL을 사용할 수 있다.

EL은 자바스크립트에서 확장된 Xpath에서 힌트를 얻어 만들어진 언어로 값이 없는 변수(null)에 대해 좀 더 관대하고 데이터 형 변환을 자동으로 해주는 특징이 있다. EL을 사용하면 값이 없거나 형 변환 등에 전혀 신경 쓸 필요 없이 서버로 전송해서 형변환 없이 사용할 수 있다.

▶EL의 내장 객체

객체명설명

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

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>      
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>게시판 목록</title>
<style type="text/css">
a:link{
text-decoration:none;
}

</style>
</head>
<body>
게시판 목록
<form name="frm" action="${pageContext.request.contextPath}/board/boardList.do" method="post">
<table  style="text-align:left;width:800px;border:0;">
<tr>
<td style="width:600px;"></td>
<td>
<select name="searchType">
<option value="subject">제목</option>
<option value="writer">작성자</option>
</select>
</td>
<td><input type="text" name="keyword" size="10"></td>
<td><input type="submit" name="submit" value="검색"></td>
</tr>
</table>
</form>
<table border=1 style="text-align:left;width:800px;">
<tr>
<td>게시물번호</td>
<td>제목</td>
<td>작성자</td>
<td>날짜</td>
</tr>

<c:forEach var="bv" items="${blist}">
<tr>
<td>${bv.bidx}</td>
<td>

<c:forEach var="i" begin="1" end="${bv.level_}" step="1">
	&nbsp;&nbsp;
<c:if test="${i==bv.level_ }">
ㄴ
</c:if>
</c:forEach>


<a href="${pageContext.request.contextPath}/board/boardContents.do?bidx=${bv.bidx}">${bv.subject}</a></td>
<td>${bv.writer} </td>
<td>${bv.writeday.substring(0,10)}</td>
</tr>
</c:forEach>



</table>
<table style="border:0, width:300px;width:800px;">
<tr>
<td style="text-align:right;">

<c:if test="${pm.prev == true}">
<a href="${pageContext.request.contextPath}/board/boardList.do?page=${pm.startPage()-1}&searchType=${pm.scri.searchType}&keyword=${pm.encoding(pm.scri.keyword)}">◀</a>
</c:if>
</td>

<td style="text-align:center;width:300px;">

<c:forEach var="i" begin="${pm.startPage}" end="${pm.endPage}" step="1">
	<a href ="${pageContext.request.contextPath}/board/boardList.do?page=${i}&searchType=${pm.scri.searchType}&keyword=${pm.encoding(pm.scri.keyword)}">${i}</a>
</c:forEach>

</td>
<td style="width:200px;text-align:left;">

<c:if test="${pm.next&&pm.endPage > 0}">
<a href="${pageContext.request.contextPath}/board/boardList.do?page=${pm.getEndPage()+1}&searchType=${pm.scri.searchType}&keyword=${pm.encoding(pm.scri.keyword)}">▶</a>
</c:if>
</td>
</tr>
</table>

<a href="${pageContext.request.contextPath}/board/boardWrite.do">글쓰기</a>
</body>
</html>

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
 <%@page import="example1230.domain.BoardVo" %>
 <%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
    
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>글 내용보기</title>
</head>
<body>
내용보기
<table  border=1 style="width:500px;">
<tr>
<td style="width:50px;">제목</td>
<td>${bv.subject}</td>
<td>  조회수(${bv.viewcnt})</td>
</tr>
<tr>
<td>파일다운로드</td>
<td>
<c:choose>
	<c:when test="${bv.filename==null }"></c:when>
	<c:otherwise><a href="${pageContext.request.contextPath}/board/fileDownload.do?filename=${bv.filename}">${bv.filename}</a></c:otherwise>
</c:choose>
</td>
</tr>

<tr>
<td>이미지</td>
<td>

<c:choose>
	<c:when test="${bv.filename==null}"></c:when>
	<c:otherwise >
			<img src="${pageContext.request.contextPath}/image/${bv.filename}" width="100%" height="100%" >
	</c:otherwise>
</c:choose>
</td>
</tr>

<tr>
<td style="height:200px;">내용</td>
<td>${bv.content}</td>
<td></td>
</tr>
<tr>
<td>작성자</td>
<td>${bv.writer}</td>
<td></td>
</tr>
<tr>
<td colspan=2 style="text-align:right;">

<button onclick = "location.href='${pageContext.request.contextPath}/board/boardModify.do?bidx=${bv.bidx}'">수정</button>
<button onclick = "location.href='${pageContext.request.contextPath}/board/boardDelete.do?bidx=${bv.bidx}'">삭제</button>
<button onclick = "location.href='${pageContext.request.contextPath}/board/boardReply.do?bidx=${bv.bidx}&originbidx=${bv.originbidx}&depth=${bv.depth}&level_=${bv.level_}'">답변</button>
<button onclick = "location.href='${pageContext.request.contextPath}/board/boardList.do'">목록</button>
</td>
</tr>
</table>
</body>
</html>

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@page import="example1230.domain.BoardVo" %>  
 <%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
    
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>글수정화면</title>
<script type="text/javascript">
function check(){	

	var fm = document.frm;	
	if (fm.subject.value == "" ){
		alert("제목을 입력하세요");
		fm.subject.focus();
		return;
	}else if (fm.contents.value == ""){
		alert("내용을 입력하세요");
		fm.contents.focus();
		return;
	}else if (fm.writer.value == ""){
		alert("작성자를 입력하세요");
		fm.writer.focus();
		return;
	}else if (fm.pwd.value == ""){
		alert("비밀번호를 입력하세요");
		fm.pwd.focus();
		return;
	}
	fm.action = "${pageContext.request.contextPath}/board/boardModifyAction.do";
	fm.method="post";
	fm.submit();
	return;
}


</script>
</head>
<body>
게시판 글수정
<form name="frm">
<input type="hidden" name="bidx" value="${bv.bidx}">
<table  border=1 style="width:500px;">
<tr>
<td>제목</td>
<td><input type="text" name="subject" value="${bv.subject}"></td>
</tr>
<tr>
<td>내용</td>
<td><textarea name="contents" cols="50"  rows="5" >${bv.content}</textarea></td>
</tr>
<tr>
<td>작성자</td>
<td><input type="text" name="writer" maxlength=10 value ="${bv.writer}"></td>
</tr>
<tr>
<td>비밀번호</td>
<td><input type="password" name="pwd" maxlength=20></td>
</tr>
<tr>
<td>파일첨부</td>
<td><input type="file" name="filename"></td>
</tr>

<tr><td colspan=2>
<input type="button" name="btn"  value="확인" onclick="check();">
<input type="reset" name="rst" value="리셋">
</td></tr>

</table>
</form>
</body>
</html>

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@page import = "example1230.domain.BoardVo " %>

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>글답변화면</title>
<script type="text/javascript">
function check(){	

	var fm = document.frm;	
	if (fm.subject.value == "" ){
		alert("제목을 입력하세요");
		fm.subject.focus();
		return;
	}else if (fm.contents.value == ""){
		alert("내용을 입력하세요");
		fm.contents.focus();
		return;
	}else if (fm.writer.value == ""){
		alert("작성자를 입력하세요");
		fm.writer.focus();
		return;
	}
	
	fm.action = "<%=request.getContextPath()%>/board/boardReplyAction.do";
	fm.method="post";
	
	fm.submit();
	return;
}


</script>
</head>
<body>
게시판 글답변
<form name="frm">
<input type="hidden" name="bidx" value="${ bv.bidx}">
<input type="hidden" name="originbidx" value="${bv.originbidx}">
<input type="hidden" name="depth" value="${bv.depth}">
<input type="hidden" name="level_" value="${bv.level_}">
<table  border=1 style="width:500px;">
<tr>
<td>제목</td>
<td><input type="text" name="subject"></td>
</tr>
<tr>
<td>내용</td>
<td><textarea name="contents" cols="50"  rows="5"></textarea></td>
</tr>
<tr>
<td>작성자</td>
<td><input type="text" name="writer" maxlength=5></td>
</tr>
<tr>
<td>비밀번호</td>
<td><input type="password" name="pwd"></td>
</tr>
<tr>
<td>파일첨부</td>
<td><input type="file" name="filename"></td>
</tr>

<tr><td colspan=2>
<input type="button" name="btn"  value="확인" onclick="check();">
<input type="reset" name="rst" value="리셋">
</td></tr>

</table>
</form>
</body>
</html>

https://daesuni.github.io/jstl/

JSTL의 기본 개념과 사용방법 정리

1. JSTL이란?

daesuni.github.io

https://velog.io/@psj0810/JSTL%EC%9D%B4%EB%9E%80-JSTL-%EA%B8%B0%EC%B4%88%EC%82%AC%EC%9A%A9%EB%B2%95

저작자표시 비영리 변경금지 (새창열림)

'TIL > JSP' 카테고리의 다른 글

[JSP] 20230322 JSP 파일 첨부된 게시 글 구현하기 (0)	2023.03.22
[JSP] 20230322 JSP 게시판 파일 첨부 (0)	2023.03.22
[JSP] 20230321 JSP 게시판 검색 기능 구현하기 (0)	2023.03.21
[JSP] 20230321 JSP 게시판 페이징 (0)	2023.03.21
[JSP] 20230320 JSP 페이징 (0)	2023.03.20

'TIL/JSP' Related Articles

me made it !

[JSP] 202320323 JSTL 구현하기 본문

[JSP] 202320323 JSTL 구현하기

'TIL > JSP' 카테고리의 다른 글

티스토리툴바