게시판 목록
링크 생성
가장 먼저 상단 메뉴바의 게시판 버튼에 url링크를 설정해준다.
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<link rel="stylesheet" href="<%= request.getContextPath() %>/js_css/style.css" type="text/css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.1/jquery.min.js"></script>
</head>
<body>
<div class="topMenu">
<ul>
<li><a href="/myapp/">홈</a></li>
<c:if test="${ logStatus!='Y' }">
<li><a href="/myapp/member/login">로그인</a></li>
<li><a href="/myapp/member/signup">회원가입</a></li>
</c:if>
<c:if test="${ logStatus=='Y' }">
<li><a href="/myapp/member/logout">로그아웃</a></li>
<li><a href="/myapp/member/myAccount?username=${ username }&name=${ name }">회원정보수정</a></li>
</c:if>
<li><a href="/myapp/board/boardList">게시판</a></li>
<li><a href="#">자료실</a></li>
</ul>
</div>컨트롤러 매핑
package com.poby.myapp.controller;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.servlet.ModelAndView;
import com.poby.myapp.service.BoardService;
@Controller
public class BoardController {
@Autowired
BoardService service;
// 게시판 목록(페이징, 검색)
@RequestMapping("/board/boardList")
public ModelAndView boardList() {
ModelAndView mav = new ModelAndView();
return mav;
}
}뷰페이지 생성
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<title>게시판 목록</title>
<div class="container">
<h1>게시판 목록</h1>
<div>
<a href="/myapp/board/boardPost">글 쓰기</a>
</div>
<ul>
<li>No.</li>
<li>제목</li>
<li>작성자</li>
<li>등록일</li>
<li>조회수</li>
<li>12</li>
<li><a href="/myapp/board/boardView?postno=#">제목1</a></li>
<li>포비</li>
<li>12-01 12:20</li>
<li>5</li>
</ul>
<!-- 페이지 처리 -->
<div>
<ul>
<li>prev</li>
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
<li>5</li>
<li>next</li>
</ul>
</div>
<!-- 검색 기능 -->
<div>
<form action="/myapp/board/boardList">
<select name="searchKey">
<option>제목</option>
<option>내용</option>
<option>작성자</option>
</select>
<input type="text" name="searchValue" id="searchValue">
<input type="submit" value="검색">
</form>
</div>
</div>게시판을 위한 별도의 css파일을 만들어서 불러오자.
@charset "UTF-8";
/* 말 줄임 : 칸 넘어가면 ... */
.word-cut{
white-space:nowrap;
overflow:hidden;
text-overflow:ellipsis;
}
.boardList, .pagesDiv>ul{
overflow:auto;
}
/* 게시판 목록 */
.boardList>li{
float:left;
height:40px;
line-height:40px;
width:10%;
border-bottom:1px solid #ddd;
}
.boardList>li:nth-child(5n+2) {
width:60%;
}
/* 페이징 */
.pagesDiv>ul>li{
float:left;
padding:5px 10px;
}
/* 검색 */
.searchDiv{
padding:20px 0px;
text-align:center;
}
게시판의 기본 뼈대를 만들었다.
이제부터 여기서 글 쓰기, 페이지, 검색, 글 보기 등 여러가지 기능을 만들 것이다.
'Spring' 카테고리의 다른 글
| 12.14.(수) Spring Framework(19): 게시판 기능(4) (0) | 2022.12.17 |
|---|---|
| 12.14.(수) Spring Framework(18): 게시판 기능(3) (0) | 2022.12.15 |
| 12.14.(수) Spring Framework(16): 게시판 기능(1) (0) | 2022.12.15 |
| 12.13.(화) Spring Framework(15): 회원관리 기능(9) (0) | 2022.12.15 |
| 12.12.(월) Spring Framework(14): 회원관리 기능(8) (0) | 2022.12.15 |