JSP12 minutes read (About 1852 words)  0 visits

JSTL과 EL : CORE 라이브러리(set), 페이지실행순서

CORE 라이브러리

  • 변수선언, 조건문, 반복문 처리 가능
  • 페이지 이동처리 가능

페이지실행순서

  • JSP(JAVA) -> JSTL -> HTML -> Javascript -> JQuery
  • 순서 차이? Javascript -> HTML -> JQuery
    • HTML -> Javascript -> JQuery 가 기본순서이고 구동방식에 따라 Javascript -> HTML -> JQuery 처럼 순서가 변경될수도있다. 기본순서를 외워두자.
  • JSTL에서는 JS값을 받아올 수 있을까? NOPE!
  • JS에서는 JSTL값을 사용할 수 있을까? YES!

set 태그

  1. 변수선언
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
<h2>JSTL 사용 변수 선언</h2>
<!-- 변수를 가져와서 연산처리하고 출력할때 EL표현식 사용해야함 -->
<!-- EL로 표현하지 않으면 인용부호 에러가 난다 -->
<c:set var="num3" value="30"/>
<c:set var="num4" value="40"/>
<c:set var="result" value="${num3+num4}" />
<c:out value="${result}"/><br>

//출력값
30
JSTL 사용 변수 선언
70
HTML: 30 + 40 = 70
JSTL: 30 + 40 = 70
JSTL: 30 + 40 = 70

변수를 가지고 페이지를 이동하기

  • 기존방식 : request 영역에 저장된 값을 받아서 출력
  • 변수값을 일일히 저장하지 않더라고 출력할 수 없을까?
  • JSTL사용해서 다른페이지 변수를 값을 받지않아도 바로 출력가능!
  • HOW? EL태그안에는 requestScope.name사용하면 됨!
  • requestScope : EL표현식에서 사용하는 내장객체
  1. JSTL 사용해서 변수 선언시 특정 영역을 지정 가능
    • 페이지를 두 개를 생성한다. set1.jsp와 set2.jsp
    • 페이지 이동시 데이터를 request 영역에 저장된 값을 받는 것 대신 그냥 바로 출력하는 방법
    • 페이지 이동시 jsp:forward 액션태그사용
    • 스코프
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
<%
//기존방식 : request 영역에 저장된 값을 받아서 출력
String name = (String)request.getAttribute("name");//다운캐스팅
%>
<h2> set1.jsp 에서 전달된 name : <%=name %></h2>

<!-- 변수값을 일일히 저장하지 않더라고 출력할 수 없을까?
	JSTL사용해서 다른페이지 변수를 값을 받지않아도 바로 출력가능
 	HOW? el태그안에는 requestScope.name사용하면 됨!
 	requestScope는 el표현식에서 사용하는 내장객체
 	아래 두 코드는 동일한 결과값을 나타내는 동일한 코드이다.
-->
<h1>여기는 set2.jsp</h1>
<h2>변수 가져와서 출력</h2>
<h3>이름 : ${name }</h3>
<h3>이름 : ${requestScope.name }</h3>

//출력값
여기는 set2.jsp
변수 가져와서 출력
이름 : 아이티윌
이름 : 아이티윌

객체를 가지고 페이지이동하기

set2.jsp페이지 생성

  • 객체를 가지고 페이지 이동시 데이터를 표시한 페이지를 생성한다.
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
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
	
<!--2-1.태그라이브러리추가  -->
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
</head>
<body>
<h2>객체정보 가져와서 출력</h2>
<!-- 2.JSTL 사용 변수에 저장후 호출
	2-2. 태그라이브러리 출력방식 
-->
<c:set var="itwill" value="${requestScope.ib }" />
<h3>이름 : ${itwill.name }</h3>
<h3>나이 : ${itwill.age }</h3>
<h3>연락처 : ${itwill.tel }</h3>

</body>
//출력값
객체정보 가져와서 출력
ID : 고양이
PW : cat
이름 : 고영희
나이 : 10
연락처 : 010-1

ItwillBean.java 자바빈객체생성

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
public class ItwillBean {
	
	private String id;
	private String pw;
	private String name;
	private int age;
	private String tel;
	
	public String getId() {
		return id;
	}
	public void setId(String id) {
		this.id = id;
	}

	(생략)
	
	@Override
	public String toString() {
		return "ItwillBean [id=" + id + ", pw=" + pw + ", name=" + name + ", age=" + age + ", tel=" + tel + "]";
	}
}

ItwillServlet.java 생성

  1. ItwillServlet에 HttpServlet에 extends(상속)한다.
    • 자바코드는 웹페이지에서 볼수없고 콘솔에서만 볼 수 있다.
    • 이때 HttpServlet를 상속함으로써 웹페이지에서 java코드를 볼 수 있다.
  2. 웹페이지 처리를 위해 doGet() 오버라이딩 (alt + shift + s + v)
    • doGet(): 페이지 처리방식이 GET방식일 때 사용
    • doPost(): 페이지 처리방식이 POST방식일 때 사용
  3. @WebServlet 어노테이션 추가
    • @WebServlet(“주소”): 클래스에 접근가능한 주소를 지정.
  4. itwill 주소 입력시 – forward –> set2.jsp화면 출력하기
    • forward는 jsp액션태그이다. jsp:forward태그를 java에서 사용하려면 어떻게 해야할까?
    • RequestDispatcher 객체사용!
    • RequestDispatcher는 포워딩 처리가능한 객체
    • request내장객체로부터 전달받아서 사용
  5. 정보를 저장해서 set2.jsp로 이동
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
32
33
34
35
36
37
38
39
40
41
42
43
44
package com.itwill.ex;

import java.io.IOException;

import javax.servlet.RequestDispatcher;
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

//3. @WebServlet 어노테이션 추가 -> 실행 -> 404페이지가 안뜨고 성공적
@WebServlet("/itwill")
public class ItwillServlet extends HttpServlet {
	//1. 웹페이지 처리를 위해 오버라이딩 alt + shift + s + v
	@Override
	protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		//2. 화면출력 -> 404에러 -> 해결방법은 3번
		 System.out.println("doGet() 호출");
		
		//5. 객체정보를 저장해서 set2.jsp로 이동
		 //5-1.변수사용해서 저장
		 request.setAttribute("name", "아이티윌");
		 //5-2.객체사용해서저장(ItwillBean 객체 생성 후 전달)
		 ItwillBean ib = new ItwillBean();
		 //객체에 정보가 없으니 정보를 객체에 저장
		 ib.setId("고양이");
		 ib.setPw("cat");
		 ib.setAge(10);
		 ib.setTel("010-1");
		 ib.setName("고영희");
		 //객체정보 request로 전달
		 request.setAttribute("ib", ib);
		 
		//4. itwill 주소 입력시 -- forward --> set2.jsp화면 출력하기
		//<jsp:forward>태그를 java에서 사용하려면 어떻게 해야할까? => RequestDispatcher 객체사용.
		//request내장객체로부터 전달받아서 사용
		 
		 //4-1.request내장객체로부터 전달
		 RequestDispatcher dis = request.getRequestDispatcher("/core/set2.jsp");
		 //4-2.포워딩
		 dis.forward(request, response);	 
	}	
}

객체 여러개(리스트계열)를 가지고 페이지이동하기

set2.jsp페이지 생성

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
<h2>벡터에 저장된 정보를 가져와서 출력</h2>
<h3>ID : ${requestScope.vec[0].id }, ${requestScope.vec[1].id }</h3>
<h3>PW : ${vec[0].pw }, ${vec[1].pw }</h3>

<!-- 벡터 전체 저장  -->
<c:set var="v" value="${requestScope.vec }" />
<h3>이름 : ${v[0].name }, ${v[1].name }</h3>
<h3>나이 : ${v[0].age }, ${v[1].age }</h3>

<!-- 벡터의 0번만 저장  -->
<c:set var="v0" value="${requestScope.vec[0] }" />
<h3>연락처 : ${v0.tel }</h3>

//출력값
벡터에 저장된 정보를 가져와서 출력
ID : 고양이, 강아지
PW : cat, dog
이름 : 고영희, 강하지
나이 : 10, 100
연락처 : 010-1

ItwillBean.java 자바빈객체생성

위의 4-2와 동일하므로 코드생략

ItwillServlet.java 생성

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
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
//3. @WebServlet 어노테이션 추가 -> 실행 -> 404페이지가 안뜨고 성공적
@WebServlet("/itwill")
public class ItwillServlet extends HttpServlet {
	//1. 웹페이지 처리를 위해 오버라이딩 alt + shift + s + v
	@Override
	protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		//2. 화면출력 -> 404에러 -> 해결방법은 3번
		 System.out.println("doGet() 호출");
		
		//5. 객체정보를 저장해서 set2.jsp로 이동
		 //5-1. 첫번째 객체 생성
		 ItwillBean ib = new ItwillBean();
		 ib.setId("고양이");
		 ib.setPw("cat");
		 ib.setAge(10);
		 ib.setTel("010-1");
		 ib.setName("고영희");
		 
		 //5-2. 두번째 객체 생성
		 ItwillBean ib2 = new ItwillBean();
		 //객체에 정보가 없으니 정보를 객체에 저장
		 ib2.setId("강아지");
		 ib2.setPw("dog");
		 ib2.setAge(100);
		 ib2.setTel("011-111");
		 ib2.setName("강하지");
		 
		 //6.List 컬렉션 사용 : vector객체
		 Vector vec = new Vector();
		 vec.add(ib); //백터에 ib객체 담음
		 vec.add(ib2); //백터에 ib2객체 담음
		 //6-1순서 : 배열에서 객체를 꺼내고 > requestScope이용해서 객체안의 데이터 꺼내고 > set2.jsp페이지에 출력
		 request.setAttribute("vec", vec);
		 System.out.println("벡터저장완료");
		 
		 //4. itwill 주소 입력시 -- forward --> set2.jsp화면 출력하기
		 //<jsp:forward>태그를 java에서 사용하려면 어떻게 해야할까? => RequestDispatcher 객체사용.
		 //request내장객체로부터 전달받아서 사용
		 
		 //4-1. request내장객체로부터 전달
		 RequestDispatcher dis = request.getRequestDispatcher("/core/set2.jsp");
		 //4-2포워딩
		 System.out.println("/core/set2.jsp로 포워딩완료");
		 dis.forward(request, response);
		 
	}

특정영역에 저장된 값 삭제 : <c:remove />

  • <c:remove /> : 사용해서 값 삭제

  • set2.jsp페이지에서 처리

1
2
3
<!-- request 영역에 있는 name값을 삭제 -->
<c:remove var="name" scope="request"/>
<h3>이름 : ${name }</h3>
#
Follow

Categories

Recent

Archives

Tags

APK1
Backjoon12
Book1
BookReview1
C#3
CORS1
CSRF1
ChatGPT1
Codeup10017
DBeaver1
DB설계1
DataStructure5
Discord1
Docker2
EL2
Eclipse10
Facebook1
GIT31
GeekNews1
Gson4
HTML&CSS30
Hackerrank10
Hexo6
HttpEntity1
ITWILL(JAVA)263
IntelliJ1
JAVA1
JSON2
JSTL4
JavaScript1
Journal22
Leetcode6
List11
Lombok1
MSA1
MariaDB9
Moment.js3
MyBatis6
MySQL11
NoSQL1
Node.js3
Oracle48
Port2
Programmers2
RESTfulAPI3
Redis1
RestTemplate2
Review20
SQLD2
SQL퀴즈2
STS7
SVN4
SpringBoot6
TIL359
Tomcat5
VanillaJS2
VueJS2
WEB2
Web Development1
Web Game9
Websocket3
YouTube1
ajax1
jQuery13
java.util.Calendar1
xAPI1
구글애드센스1
디자인패턴4
생활코딩5
설치1
오늘또못알아듣고말았습니다14
오류일지18
정규표현식3
차이17
패스트캠퍼스(초격차Java/Spring)12
패스트캠퍼스(파이썬웹개발)37
회고록10

Advertisement

×