반응형
# MVC03_11 MVC03 JSTL 적용
## JSTL 실습_반복문에서 ArrayList 출력
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@ page import="kr.bit.model.*" %>
<%@ page import="java.util.*" %>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%
MemberVO vo = new MemberVO();
vo.setNum(1);
vo.setId("abcde");
vo.setName("뽀로로");
vo.setEmail("qhqhqh@naver.com");
List<MemberVO> list = new ArrayList<MemberVO>();
list.add(vo);
list.add(vo);
list.add(vo);
list.add(vo);
list.add(vo);
request.setAttribute("list", list);
%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
<table border="1">
<tr>
<td>번호</td>
<td>아이디</td>
<td>이름</td>
<td>이메일</td>
</tr>
<c:forEach var="vo" items="${list}">
<tr>
<td>${vo.num}</td>
<td>${vo.id}</td>
<td>${vo.name}</td>
<td>${vo.email}</td>
</tr>
</c:forEach>
</table>
</body>
</html>## MVC03 에 JSTL 적용1_memberList.jsp
- 기존 코드 주석 or 제거 후 JSTL로 적용
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@ page import="kr.bit.model.*" %>
<%@ page import="java.util.*" %>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%
// JSTL 사용 전.
// ArrayList<MemberVO> list = (ArrayList<MemberVO>) request.getAttribute("list");
%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<meta name='viewport' content='width=device-width, initial-scale=1'>
<link rel='stylesheet' href='https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css'>
<script src='https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js'></script>
<script src='https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js'></script>
<script>
function deleteFn(num) {
location.href="memberDelete.do?num=" + num;
}
</script>
</head>
<body>
[MVC03 예제 - Controller + View]
<table class="table table-bordered">
<tr>
<td>번호</td>
<td>아이디</td>
<td>비밀번호</td>
<td>이름</td>
<td>나이</td>
<td>이메일</td>
<td>전화번호</td>
<td>삭제</td>
</tr>
<c:forEach var="vo" items="${list}">
<tr>
<td>${vo.getNum()}</td>
<td><a href="memberContent.do?num=${vo.getNum()}">${vo.getId()}</a></td>
<td>${vo.getPass()}</td>
<td>${vo.getName()}</td>
<td>${vo.getAge()}</td>
<td>${vo.getEmail()}</td>
<td>${vo.getPhone()}</td>
<td><input type="button" value="삭제" class="btn btn-warning" onclick="deleteFn(${vo.getNum()})" /></td>
</tr>
</c:forEach>
<tr>
<td colspan="8" align="right"><input type="button" value="회원가입" class="btn btn-primary" onclick="location.href='member/memberRegister.html'"/></td>
</tr>
</table>
</body>
</html>## MVC03 에 JSTL 적용2_memberContent.jsp
- 기존 코드 주석 or 제거 후 JSTL로 적용
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@ page import="kr.bit.model.*" %>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%
// JSTL 사용 전
// MemberVO vo = (MemberVO)request.getAttribute("vo");
%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<meta name='viewport' content='width=device-width, initial-scale=1'>
<link rel='stylesheet' href='https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css'>
<script src='https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js'></script>
<script src='https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js'></script>
</head>
<body>
<form action="memberUpdate.do" method="post">
<input type="hidden" name="num" value="${vo.getNum()}"/>
<table border="1" class="table table-bordered">
<c:if test="${vo != null}">
<tr>
<td colspan="2">${vo.getName()} 회원의 상세보기</td>
</tr>
<tr>
<td>번호</td>
<td>${vo.getNum()}</td>
</tr>
<tr>
<td>아이디</td>
<td>${vo.getId()}</td>
</tr>
<tr>
<td>비밀번호</td>
<td>${vo.getPass()}</td>
</tr>
<tr>
<td>이름</td>
<td>${vo.getName()}</td>
</tr>
<tr>
<td>나이</td>
<td><input type="text" name="age" value="${vo.getAge()}" /></td>
</tr>
<tr>
<td>이메일</td>
<td><input type="text" name="email" value="${vo.getEmail()}" /></td>
</tr>
<tr>
<td>전화번호</td>
<td><input type="text" name="phone" value="${vo.getPhone()}" /></td>
</tr>
</c:if>
<tr>
<td colspan="2" align="center">
<input type="submit" value="수정하기" class="btn btn-primary" />
<input type="reset" value="취소" class="btn btn-warning" />
<input type="button" value="리스트" onclick="location.href='/MVC03/memberList.do'" class="btn" />
</td>
</tr>
</table>
</form>
</body>
</html>반응형
'인프런 강의 학습 > MVC 프레임워크_나프1탄' 카테고리의 다른 글
| 인프런 MVC 프레임워크는 내손에 41일차 : MVC04_01~02 FrontController, if~else if로 요청 처리하기 (0) | 2021.06.18 |
|---|---|
| 인프런 MVC 프레임워크는 내손에 40일차 : MVC03_12 다음 MVC04 작업 방향 (0) | 2021.06.17 |
| 인프런 MVC 프레임워크는 내손에 38일차 : MVC03_10 JSTL 활용하기_ArrayList (0) | 2021.06.17 |
| 인프런 MVC 프레임워크는 내손에 37일차 : MVC03_08~09 JSTL과 EL이란? (0) | 2021.06.16 |
| 인프런 MVC 프레임워크는 내손에 36일차 : MVC03_07 MVC 회원관리 흐름도 (0) | 2021.06.15 |