-
211021_파일입출력을 이용해서 게시판 만들기JSP 2021. 10. 21. 12:31
퀀텀db로 테이블 생성 순서
퀀텀db에서 테이블 생성 - simpleDto - boardform - simpledao(insert) -boardaction -dao(전체출력) -boardlist - dao(조회수증가,num에 해당하는 하나의 데이터 조회) - content - index - boardlist2 - updateform - updateaction - dao(isEqualPass) - dao(updateboard)
SimpleDto
package simpleboard.model;
import java.sql.Timestamp;
public class SimpleDto {
private String num;
private String writer;
private String subject;
private String content;
private String imgname;
private String pass;
private int readcount;
private Timestamp writeday;
//setter,getter
public String getNum() {
return num;
}
public void setNum(String num) {
this.num = num;
}
public String getWriter() {
return writer;
}
public void setWriter(String writer) {
this.writer = writer;
}
public String getSubject() {
return subject;
}
public void setSubject(String subject) {
this.subject = subject;
}
public String getContent() {
return content;
}
public void setContent(String content) {
this.content = content;
}
public String getImgname() {
return imgname;
}
public void setImgname(String imgname) {
this.imgname = imgname;
}
public String getPass() {
return pass;
}
public void setPass(String pass) {
this.pass = pass;
}
public int getReadcount() {
return readcount;
}
public void setReadcount(int readcount) {
this.readcount = readcount;
}
public Timestamp getWriteday() {
return writeday;
}
public void setWriteday(Timestamp writeday) {
this.writeday = writeday;
}
}
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
SimpleDao
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
boardform.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<link href="https://fonts.googleapis.com/css2?family=Do+Hyeon&display=swap" rel="stylesheet">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css">
<script src="https://code.jquery.com/jquery-3.5.0.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script>
<title>Insert title here</title>
</head>
<body>
<form action="boardaction.jsp" method="post" enctype="multipart/form-data">
<table class="table table-bordered" style="width: 500px;">
<tr>
<th style="width: 100px;" bgcolor="#fffacd">작성자</th>
<td>
<input type="text" name="writer" class="form-control" style="width: 200px;"
placeholder="writer" autofocus="autofocus" required="required">
</td>
</tr>
<tr>
<th style="width: 100px;" bgcolor="#fffacd">제목</th>
<td>
<input type="text" name="subject" class="form-control" style="width: 400px;"
placeholder="subject" autofocus="autofocus" required="required">
</td>
</tr>
<tr>
<th style="width: 100px;" bgcolor="#fffacd">이미지 업로드</th>
<td>
<input type="file" name="photo" class="form-control" style="width: 300px;"
required="required">
</td>
</tr>
<tr>
<th style="width: 100px;" bgcolor="#fffacd">비밀번호</th>
<td>
<input type="text" name="pass" class="form-control" style="width: 200px;"
required="required" placeholder="password">
</td>
</tr>
<tr>
<td colspan="2">
<textarea style="width: 500px; height: 200px;"
class="form-control" name="content" required="required"></textarea>
</td>
</tr>
<tr>
<td colspan="2" align="center">
<button type="submit" class="btn btn-success">저장</button>
<button type="button" class="btn btn-info"
onclick="location.href='boardlist.jsp'">목록</button>
</td>
</tr>
</table>
</form>
</body>
</html>
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
boardaction.jsp
<%@page import="simpleboard.model.SimpleDto"%>
<%@page import="simpleboard.model.simpleDao"%>
<%@page import="com.oreilly.servlet.multipart.DefaultFileRenamePolicy"%>
<%@page import="com.oreilly.servlet.MultipartRequest"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<link href="https://fonts.googleapis.com/css2?family=Do+Hyeon&display=swap" rel="stylesheet">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css">
<script src="https://code.jquery.com/jquery-3.5.0.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script>
<title>Insert title here</title>
</head>
<body>
<%
//post방식이니까 한글 엔코딩
request.setCharacterEncoding("utf-8");
//업로드에 필요한 변수선언
//업로드할 경로(톰캣에 올라가는 프로젝트 경로)
String realFolder=getServletContext().getRealPath("/photo(1021)");
System.out.println(realFolder); //경로 확인용
//업로드 사이즈
int uploadsize=1024*1024; //1mb
try{
//생성자 파라메터
//request,업로드폴더,업로드사이즈,한글타입(utf-8),new DefaultFileRenamePolicy()
MultipartRequest multi=new MultipartRequest(request,realFolder,
uploadsize,"utf-8",new DefaultFileRenamePolicy());
//입력값 읽기..request가 아닌 multi로 읽어야 함
String writer=multi.getParameter("writer");
String subject=multi.getParameter("subject");
String content=multi.getParameter("content");
String pass=multi.getParameter("pass");
//실제 업로드 이미지명 읽어오기
String imgname=multi.getFilesystemName("photo");
//dto에 담아서 dao메서드에 전달
SimpleDto dto=new SimpleDto();
dto.setWriter(writer);
dto.setSubject(subject);
dto.setContent(content);
dto.setPass(pass);
dto.setImgname(imgname);
simpleDao dao=new simpleDao();
dao.insertBoard(dto);
//리스트로 이동
response.sendRedirect("boardlist.jsp");
}catch(Exception e){
System.out.println("업로드 오류: "+e.getMessage());
}
%>
</body>
</html>
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
boardlist.jsp
<%@page import="java.text.SimpleDateFormat"%>
<%@page import="simpleboard.model.SimpleDto"%>
<%@page import="java.util.List"%>
<%@page import="simpleboard.model.simpleDao"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<link href="https://fonts.googleapis.com/css2?family=Do+Hyeon&display=swap" rel="stylesheet">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css">
<script src="https://code.jquery.com/jquery-3.5.0.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script>
<title>Insert title here</title>
</head>
<body>
<%
//dao선언
simpleDao db=new simpleDao();
//list가져오기
List<SimpleDto>list=db.getAllDatas();
%>
<!-- 출력 -->
<div class="alert alert-danger" style="width: 800px;">
<b>총 <%=list.size()%>개의 글이 있습니다</b>
</div>
<br>
<table class="table table-hover" style="width: 800px;">
<caption><b>게시판형 목록보기</b>
<button type="button" class="btn btn-info btn-sm"
onclick="location.href='boardform.jsp'" style="margin-left: 600px;">글작성</button>
</caption>
<tr style="background: #ffe4e1;">
<th style="width: 70px;">번호</th>
<th style="width: 400px;">제목</th>
<th style="width: 100px;">작성자</th>
<th style="width: 120px;">작성일</th>
<th style="width: 70px;">조회수</th>
</tr>
<%
//날짜형식
SimpleDateFormat sdf=new SimpleDateFormat("yyyy-MM-dd");
for(int i=0;i<list.size();i++)
{
int no=list.size()-i; //역순으로 넘버링..1번열출력할 번호
SimpleDto dto=list.get(i); //i번째 dto얻기
%>
<tr>
<!-- 번호 -->
<td align="center"><%=no %></td>
<!-- 제목 클릭시 내용보기로 가도록 -->
<td>
<a href="content.jsp?num=<%=dto.getNum()%>"> <!-- 해당num만 보게 -->
<img alt="" src="../photo(1021)/<%=dto.getImgname() %>" style="width: 30px; height: 30px;">
<%=dto.getSubject() %>
</a>
</td>
<!-- 작성자 -->
<td><%=dto.getWriter() %></td>
<!-- 작성일 -->
<td><%=sdf.format(dto.getWriteday()) %></td>
<!-- 조회수 -->
<td align="center"><%=dto.getReadcount() %></td>
</tr>
<%}
%>
</table>
</body>
</html>
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
content.jsp
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
index.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<link href="https://fonts.googleapis.com/css2?family=Do+Hyeon&display=swap" rel="stylesheet">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css">
<script src="https://code.jquery.com/jquery-3.5.0.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script>
<title>Insert title here</title>
</head>
<body>
<!-- 인덱스를 이용하여 레이아웃 변경해보기 -->
<h2>여러 모양으로 게시판 출력하기</h2>
<hr>
<button type="button" class="btn btn-lg btn-danger"
onclick="location.href='boardlist.jsp'">게시판형 목록</button>
<button type="button" class="btn btn-lg btn-info"
onclick="location.href='boardlist2.jsp'">앨범형 목록</button>
</body>
</html>
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
boardlist.jsp
<%@page import="java.text.SimpleDateFormat"%>
<%@page import="java.util.List"%>
<%@page import="simpleboard.model.simpleDao"%>
<%@page import="simpleboard.model.SimpleDto"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<link href="https://fonts.googleapis.com/css2?family=Do+Hyeon&display=swap" rel="stylesheet">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css">
<script src="https://code.jquery.com/jquery-3.5.0.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script>
<title>Insert title here</title>
<style type="text/css">
a:link {
text-decoration: none;
font-size: 10px;
color: black;
font-weight: bold;
}
</style>
</head>
<body>
<%
//db선언
simpleDao db=new simpleDao();
//전체리스트 가져오기
List<SimpleDto>list=db.getAllDatas();
%>
<table style="width: 900px;">
<caption><b>앨범형 목록보기</b>
<button type="button" class="btn btn-success btn-sm"
onclick="loaction.href='boardform.jsp'">글작성</button>
</caption>
<tr>
<%
//출력할 날짜형식
SimpleDateFormat sdf=new SimpleDateFormat("yyyy-MM-dd");
for(int i=0;i<list.size();i++)
{
//1번열에 출력할 번호..역순으로 나타내기
int no=list.size()-i;
//i번째 dto
SimpleDto dto=list.get(i);
%>
<td>
<a href="content.jsp?num=<%=dto.getNum()%>">
<img alt="" src="../image/<%=dto.getImgname()%>"
style="width: 180px; height: 180px; border: 1px solid gray; margin: 5px;">
<br>
<%=dto.getSubject() %> </a>
<br>
<span style="color: gray; font-size: 12px;">
조회: <%=dto.getReadcount() %> | <%=sdf.format(dto.getWriteday()) %>
<br>
<%=dto.getWriter() %>
</span>
<br><br><br>
</td>
<%
if((i+1)%4==0)
{%>
</tr>
<tr>
<%}
%>
<%}
%>
</tr>
</table>
</body>
</html>
'JSP' 카테고리의 다른 글
211022_게시판 만들기 (0) 2021.10.25 211021_파일입출력 개념(내용추가해야함) (0) 2021.10.21 211021_파일입출력(여러개) (0) 2021.10.21 211021_파일입출력 (0) 2021.10.21 211020_session (0) 2021.10.20