프로젝트

가전제품 대여 웹사이트 (세숫대여) - 자유게시판 글 상세보기 기능 구현

sejin2 2023. 9. 28. 00:10

게시판 목록에서 제목을 누르면 해당 글의 상세보기 페이지로 이동하는 기능을 구현하였다.

게시글 상세보기 화면

freeboarddetail.jsp 


		<div class="container-fluid mt--7">
			<div class="row mt-5">
				<div class="col-xl-12 mb-5 mb-xl-0">
					<div class="card shadow">
						<div class="card-header border-0">
							<div class="row align-items-right">
								<div class="col">
									<h3 style="font-weight: bold" class="mb-0">자유게시글 상세정보</h3>
								</div>
								<div class="col text-right"></div>
							</div>
						</div>
						<div class="card-body">
							<form action="freeboardwrite" method="post">
								<div class="pl-lg-12" style="magin: 0 auto;">
									<div class="row">
										<div class="col-lg-6">
											<div class="form-group focused">
												<label style="font-size: 12pt" class="form-control-label"
													for="input-freeBoardTitle">게시글 제목</label> <input
													disabled="disabled" type="text" id="input-freeBoardTitle"
													name="freeBoardTitle"
													class="form-control form-control-alternative"
													value="${ freeBoard.freeBoardTitle }" />
											</div>
										</div>
										<div class="col-lg-6">
											<div class="form-group">
												<label style="font-size: 12pt" class="form-control-label"
													for="input-freeBoardNo">글번호</label> <input
													disabled="disabled" type="text" id="input-freeBoardNo"
													name="freeBoardNo"
													class="form-control form-control-alternative"
													value="${ requestScope.freeBoard.freeBoardNo }" />
											</div>
										</div>
									</div>
									<div class="row">
										<div class="col-lg-6">
											<div class="form-group focused">
												<label style="font-size: 12pt" class="form-control-label"
													for="input-freeBoardDate">게시글 작성 일자</label> <input
													disabled="disabled" type="datetime"
													id="input-freeBoardDate" name="freeBoardDate"
													class="form-control form-control-alternative"
													value="${ freeBoard.freeBoardDate }"
													pattern="yyyy-MM-dd HH:mm" />
											</div>
										</div>
										<div class="col-lg-6">
											<div class="form-group">
												<label style="font-size: 12pt" class="form-control-label"
													for="input-freeBoardNo">작성자</label> <input
													disabled="disabled" type="text" id="input-freeBoardNo"
													name="freeBoardNo"
													class="form-control form-control-alternative"
													value="${ requestScope.freeBoard.freeBoardNo }" />
											</div>
										</div>
									</div>
									<div class="row">
										<div class="col-lg-6">
											<div class="form-group focused">
												<label style="font-size: 12pt" class="form-control-label"
													for="input-freeBoardAttach">첨부파일</label> <br>
												<td><c:forEach var="freeBoardAttach"
														items="${ freeBoard.freeBoardAttachList }">
														<a href="download?attachNo=${ freeBoardAttach.attachNo }">
															${freeBoardAttach.attachFileName}</a>
													</c:forEach></td>
											</div>
										</div>
										<div class="col-lg-6">
											<div class="form-group">
												<label style="font-size: 12pt" class="form-control-label"
													for="input-freeBoardViewCount">조회수</label> <input
													disabled="disabled" type="text"
													id="input-freeBoardViewCount" name="freeBoardViewCount"
													class="form-control form-control-alternative"
													value="${ freeBoard.freeBoardViewCount }" />
											</div>
										</div>
									</div>
									<div class="row">
										<div class="col-lg-12">
											<div class="form-group focused">
												<label style="font-size: 12pt" class="form-control-label"
													for="input-freeBoardContent">글내용</label>
												<textarea style="resize: none" disabled="disabled" rows="15"
													id="input-freeBoardContent" name="freeBoardContent"
													class="form-control form-control-alternative">${ freeBoard.freeBoardContent }</textarea>
											</div>
										</div>
									</div>
								</div>
							</form>
							<div class="col text-center">
								<input type="button" class="btn btn btn-primary"
									id="btnBackToList" value="목록으로 돌아가기"> <input
									type="button" class="btn btn btn-primary" id="btnedit"
									value="게시글 수정하기"> <input type="button"
									class="btn btn btn-primary" id="btndelete" value="게시글 삭제하기">
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>

Controller

FreeBoardController.java

@GetMapping(path = {"/freeboarddetail"})
	public String detail(@RequestParam(defaultValue = "-1") int freeBoardNo, Model model) { 
		if(freeBoardNo == -1) {  // 주소창에 detail로 바로 접근하지 못하게 함 
			return "redirect:freeboardlist";
		} 
		FreeBoardDto freeboard = freeBoardService.findFreeBoardByFreeBoardNo(freeBoardNo); 
		if(freeboard == null) { // 조회된 글이 없을때 리스트로 이동  
			return "redirect:freeboardlist";
		} 
		model.addAttribute("freeBoard", freeboard); 
		return "freeboard/freeboarddetail"; 
	}

Service

FreeBoardService.java

FreeBoardDto findFreeBoardByFreeBoardNo(int freeBoardNo);

FreeBoardServiceImpl.java

@Override
	public FreeBoardDto findFreeBoardByFreeBoardNo(int freeBoardNo) {
		FreeBoardDto freeBoard = freeboardMapper.selectFreeBoardByFreeBoardNo(freeBoardNo); 
		return freeBoard; 
	}

Mapper

FreeBoardMapper.java

@Select("select freeBoardNo, freeBoardTitle, memberNo, freeBoardDate, freeBoardViewCount, freeBoardContent " 
			+ "from FreeBoard "
			+ "where freeBoardNo = #{ freeBoardNo }")
	FreeBoardDto selectFreeBoardByFreeBoardNo(@Param("freeBoardNo") int freeBoardNo);

실행결과 게시글 상세보기 기능이 작동되고, 저장한 값도 잘 들어오는 것을 확인할 수 있다.