기초공사 (html,css,javascript)
EL을 사용한 list.jsp코드 본문
//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"%>
<%@ page import="java.sql.*" %>
<%@ page import = "java.util.*" %><!-- ArrayList를 사용하기 위한 것. -->
<%@ page import = "com.companyboard.db.*" %>
<!-- 한글오류 해결 따로 빼주어야 함 -->
<% request.setCharacterEncoding("utf-8"); %>
<%
//게시글이 담긴 DTO객체들의 리스트를 얻음
ArrayList<BoardDto> dtoList = new BoardDao().selectList();
%>
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="css/import.css">
<title>LIST</title>
</head>
<body>
<div class="wrapper" style="padding: 20px;">
<!-- 페이지 타이틀 -->
<div class="tit-wrap">
<h2 class="tit">뉴스&미디어</h2>
</div>
<!--// 페이지 타이틀 -->
<!-- 셀렉트/검색창 -->
<div class="slt-serch">
<div class="slt-wrap slt-type01 frm-item">
<select name="#" id="#" class="slt">
<option value="#" selected>전체</option>
<option value="#">전체</option>
<option value="#">전체</option>
</select>
</div>
<div class="inp-btn frm-item">
<div class="inp-wrap inp-type01">
<input type="text" placeholder="내용을 입력하세요" class="inp">
</div>
<button type="button" class="btn btn-type01">
<span class="btn-txt">검색</span>
</button>
</div>
</div>
<!-- 셀렉트/검색창 -->
<div class="content">
<!-- 게시글 목록 -->
<div class="tbl-wrap tbl-type01">
<table class="tbl">
<caption>뉴스&미디어 게시글 목록</caption>
<colgroup>
<col class="col1" style="width: 15%;"></col>
<col class="col2" style="width: 70%;"></col>
<col class="col3" style="width: 15%;"></col>
<col class="col3" style="width: 15%;"></col>
<col class="col3" style="width: 15%;"></col>
</colgroup>
<thead>
<tr>
<th scope="col">번호</th>
<th scope="col">제목</th>
<th scope="col">작성자</th>
<th scope="col">등록일</th>
<th scope="col">조회수</th>
</tr>
</thead>
<!-- 리스트의 모든DTO 객체의 내용을 화면에 출력-->
<%
//리스트의 모든 DTO 객체의 내용을 화면에 출력
for (BoardDto dto : dtoList){
request.setAttribute("msg", dto);
%>
<tr>
<td>${msg.id}</td>
<td>
<a href="view.jsp?key=${msg.id}">
${msg.btitle}
</a>
</td>
<td>${msg.reguser}</td>
<td>${msg.regdate}</td>
<td>${msg.hits}</td>
</tr>
<%
}
%>
</table>
</div>
<!--글쓰기 버튼 -->
<br>
<div class="write-container">
<input type="button" value="글쓰기" class="btn btn-type01 btn-txt" onclick="location.href='write.jsp'">
</div>
<!--// 게시글 목록 -->
<!-- 페이지 네비 -->
<div class="page-nav-wrap">
<div class="page-nav">
<button type="button" title="처음으로 가기" class="btn-page first"></button>
<button type="button" title="이전으로 가기" class="btn-page pre"></button>
<ul class="num-list">
<li class="btn-page on">
<a href="#" class="btn-txt">1</a>
</li>
<li class="btn-page">
<a href="#" class="btn-txt">2</a>
</li>
<li class="btn-page">
<a href="#" class="btn-txt">3</a>
</li>
<li class="btn-page page-last"><!-- 마지막 목록페이지: .btn-page.page-last -->
<a href="#" class="btn-txt" title="마지막 목록페이지">5</a><!-- 마지막 목록페이지: title="마지막 목록페이지" -->
</li>
</ul>
<button type="button" title="다음으로 가기" class="btn-page next"></button>
<button type="button" title="마지막으로 가기" class="btn-page last"></button>
</div>
</div>
<!--// 페이지 네비 -->
</div>
</div>
</body>
</html>위의 코드에서,
for (BoardDto dto : dtoList){
request.setAttribute("msg", dto);
for반복문에서 DTO하나를 꺼내서 자바변수 dto에 담아주면 이것을 request에 저장한다.
EL을 사용할 준비를 하는것이다.
그러고나면. 아래행에서 DTO에 담긴 값들을 EL로 출력한다.
<tr>
<td>${msg.id}</td>
<td><a href="view.jsp?key=${msg.id}">${msg.btitle}</a></td>
<td>${msg.reguser}</td>
<td>${msg.regdate}</td>
<td>${msg.hits}</td>
</tr>
HTML파트에 자바 코드가 여전히 조금은 남아있지만, 반복문을 구현 행이 그것이다.
이것을 없애는 것이 다음에 할일 JSTL을 사용하는것이다.
'게시판' 카테고리의 다른 글
| forward (0) | 2024.01.19 |
|---|---|
| JSTL 적용한 list.jsp코드 (0) | 2024.01.18 |
| Dao Dto 적용된 모든jsp코드 (0) | 2024.01.18 |
| 모든jsp에 dao적용 (0) | 2024.01.18 |
| 오류 - LocalTime /해결 (0) | 2024.01.17 |
'게시판' Related Articles
more
