MVC 패턴에서 Model을 좀 더 자세히 배움. 이제 컨트롤러에서 메소드 매개변수에 뭘 써야될 지 제법 헷갈림ㅋㅋㅋ 뭐가 많어..
- JSP에서 프로그래밍 코드를 사용하는 방법
- Controller에서 JSP로 데이터를 넘기는 방법
이 두 가지에 대해 살펴봄
JSP에서 프로그래밍 코드를 사용하는 방법
- scriptlet
- expression language
- jstl
Controller(C)에서 JSP(V)로 데이터를 넘기는 방법
- model(M)
- 프로그래밍 처리(C) → 데이터(M) → 출력(V)
JSP for Java
SCRPITLET
JSP에서는 Java 코드를 사용할 수 있음. 단, <% %>(scriptlet)을 통해 명시를 해야 함
- 이 구간을 렌더링(변환)해서 View에 결과를 출력하는 것(SSR, Server Side Rendering)
값을 출력하려면 별도의 출력구문을 사용해야 함(Java와 HTML 영역이 구분되기 때문)
-
<% %>(expression, 표현식)로 변수명을 감싸면 출력이 됨 -
장점: Java의 코드를 그대로 쓸 수 있음
-
단점: 가독성이 떨어짐
-
Java 코드를 쓸 수 있는 Controller가 있으므로 scriptlet은 사용하지 않음
-
MVC 패턴에 따라 C: Java, V: HTML 규칙을 유지하려고 함
-
View에서 자바 코드 효과를 내는 태그인
JSTL사용<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <% for(int i=0; i<10; i++){ %> <h1>Hello <%=i%></h1> <% } %>
-
JSTL
- 자바서버 페이지 표준 태그 라이브러리(JavaServer Pages Standard Tag Library)
- JSP에서 자바 코드 없이
자바 코드 효과를 내기 위해서 존재 - core package 위주로 살펴볼 예정(변수 생성, 조건, 반복)
등록이 필요함
JSTL 등록
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>- prefix: 태그의 접두사 (core 패키지에서 보통 c를 씀)
- tagdir: 내가 태그를 직접 만들었을 때 태그의 위치를 알려주는 속성
- uri: 이미 있는 태그를 쓸 때
- core 버전 1.1 골라야 함
반복문
- c:forEach (for문)
<c:forEach var="변수명" begin="초기값" end="반복횟수" step="증감식"> <!-- 반복할 내용 --!> </c:forEach>
출력
- Expression Language(
EL)를 사용-
${변수명}<c:forEach var="변수명" begin="초기값" end="반복횟수" step="증감식"> <h1>JSTL 반복 ${i}</h1> </c:forEach>
-
Model
Controller(C)에서 JSP(V)로 데이터를 넘기는 방법
현재 컨트롤러 구조에서 화면으로 데이터를 보낼 수 있는 방법
- 매개변수에 Model 타입의 객체를 선언
- Spring에 이미 Model 클래스가 등록되어 있음(
import org.springframework.ui.Model;)
- Spring에 이미 Model 클래스가 등록되어 있음(
- model에 데이터 추가
model.addAttribute("이름", 값);- 이름은 문자열, 값은 아무거나(Object 타입) 가능
- 포워딩될 때 데이터가 같이 넘어감
//Controller.java
@GetMapping("/test01")
public String test01(Model model) {
//임의의 PocketMonsterDto를 3개 생성, View에 전달
PocketMonsterDto a = new PocketMonsterDto();
a.setNo(9); a.setName("피카츄"); a.setType("전기");
PocketMonsterDto b = new PocketMonsterDto();
b.setNo(10); b.setName("파이리"); b.setType("불꽃");
PocketMonsterDto c = new PocketMonsterDto();
c.setNo(11); c.setName("꼬부기"); c.setType("물");
List<PocketMonsterDto> list= List.of(a,b,c);
model.addAttribute("list", list);
return "dynamic/test01";
}컨트롤러에서 전달받은 데이터 출력
- EL 사용
- 정식표현:
${requestScope.name} - 약식표현:
${name}
- 정식표현:
- 확장 반복문
var=”변수 이름”items=”컨트롤러에서 전달받은 데이터”
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%--
for(PocketMonserDto dto : list){
System.out.println(dto);
}를 jstl로 작성
--%>
<c:forEach var="dto" items="${list}">
<h1>${dto}</h1>
</c:forEach>
JSP-Oracle 연동
SELECT-List
- DAO: RowMapper, select 쿼리 작성
//Dao List<PocketMonsterDto> selectList(); //DaoImpl private RowMapper<PocketMonsterDto> mapper = (rs, idx) -> { PocketMonsterDto dto = new PocketMonsterDto(); dto.setNo(rs.getInt("no")); dto.setName(rs.getString("name")); dto.setType(rs.getString("type")); return dto; }; @Override public List<PocketMonsterDto> selectList() { String sql="select * from pocket_monster order by no asc"; return jdbcTemplate.query(sql, mapper); } - Controller: model에 목록 데이터를 추가 → 목록을 View로 전달
//PocketMosnterController @GetMapping("/list") public String list(Model model) { List<PocketMonsterDto> list = pocketMonsterDao.selectList(); model.addAttribute("list", list); return "pocketmon/list"; } - View: 전달받은 목록 데이터를 반복문을 통해 행 별로 출력
- <td>행에 불러올 데이터: getter() 사용
- 자동완성 지원이 안돼서 불편하나,
추론기능 지원(매핑할 변수명과 컬럼명을 맞춰야 함)
→[var].[column]()
- 자동완성 지원이 안돼서 불편하나,
- <td>행에 불러올 데이터: getter() 사용
<!-- pocketmon/list.jsp -->
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<html>
<head>
<meta charset="UTF-8">
<title>포켓몬 목록</title>
</head>
<body>
<div align="center">
<h1>포켓몬 목록</h1>
<table border="1" width="400">
<thead>
<tr>
<th>번호</th>
<th>이름</th>
<th>속성</th>
</tr>
</thead>
<tbody align="center">
<c:forEach var="dto" items="${list}">
<tr>
<!--
<td>${dto.getNo()}</td>
<td>${dto.getName()}</td>
<td>${dto.getType()}</td>
-->
<td>${dto.no()}</td>
<td>${dto.name()}</td>
<td>${dto.type()}</td>
</tr>
</c:forEach>
</tbody>
</table>
</div>
</body>
</html>SELECT-Search
목록에 검색 기능 추가
- type과 keyword가 있을 때와 없을 때로 구분해서 목록 조회와 검색결과 조회 기능을 한 페이지로 구현
//Controller
@GetMapping("/list")
public String list(Model model,
@RequestParam(required=false) String type,
@RequestParam(required=false) String keyword) {
boolean isSearch = type!=null && keyword!=null;
if(isSearch) {
model.addAttribute("list", guestBookDao.selectList(type, keyword));
}else {
model.addAttribute("list", guestBookDao.selectList());
}
return "guestbook/list";
}JSP 파일에 검색바 추가
- type과 keyword 모두 <input>으로 입력받아도 되지만, type은 선택할 수 있는 항목이 정해져 있음
- <select>와 <option> 태그를 사용하면 드롭다운 메뉴를 생성할 수 있음
<!-- guestbook/list.jsp -->
<select name="type">
<option value="name">이름</option>
<option value="memo">내용</option>
</select>
