본문 바로가기
[JSP]

[JSP]11월 2일 게시판 만들기 예제( 읽고,쓰고,삭제,수정 기능이 담긴 게시판)

jsm9301 2015. 11. 3. 09:53
*JSP 게시판 만들기 예제!

만들기에 앞서 mysql과 연동해야하니까 mysql에 테이블을 작성해준다.



저는 이런식으로 작성했다.


테이블을 작성해주신다음 JSP 프로젝트에 테이블에 대한 model클래스와 dao 클래스를 작성해준다.

model 클래스와 dao 클래스는 JAVA글 목록에보면 자세히 나와있습니다!

(dao 클래스 참고 자료 http://smjava.tistory.com/39)

그리고 잊지 말아야 할것은 프로젝트에 라이브러리 추가!



이제 첫페이지를 작성해보자.

첫페이지는 이런식으로 작성할것이다.


여기서 번호는 id.

<body> 만 작성 하겠습니다.

list.jsp


<body>

<%

SimpleDateFormat sdf = new SimpleDateFormat("yyyy-MM-dd");

List<Board> list = BoardDao.getInstance().selectAll();

%>

<table>

<tr>

<td colspan="5" bgcolor="pink"></td>

</tr>

<tr>

<th align="center" width="100">번호</th>

<th align="center" width="300">제목</th>

<th align="center" width="200">작성자</th>

<th align="center" width="100">등록일자</th>

<th align="center" width="100">조회수</th>

</tr>

<tr>

<td colspan="5" bgcolor="pink"></td>

</tr>


<%

for(Board b : list)

{

%>

<tr>

<td align="center"><%=b.getId() %></td>

<td align="center"><a href = "/JSP_Board/boardInfo.jsp?id=<%=b.getId()%>"><%=b.getTitle()%></a></td>

<td align="center"><%=b.getWriter() %></td>

<td align="center"><%=sdf.format(b.getDate()) %></td>

<td align="center"><%=b.getHit() %></td>

</tr>

<%

}

%>


<tr>

<td colspan="5" bgcolor="pink"></td>

</tr>

<tr>

<td align="right" colspan="5"><form action="writeForm.jsp">

<input type="submit" value="글쓰기">

</form>

</td>

</tr>

</table>

</body>


제목에 링크를 걸었습니다. 제목을 눌럿을때 그 글에대한 정보(내용, 작성자, 제목)가 나오는 페이지로 넘어가기 위해서이다.

링크 설정시 그 제목이 가지고 있는 id 를 가져가야 정보 조회가 가능하기 때문에 

"/JSP_Board/boardInfo.jsp?id=<%=b.getId()%>"> 이런식으로 파라미터로 id를 작성해서 넘겨준다.



링크를 눌렀을때 글에대한 정보를 볼 수 있는 페이지

*boardInfo.jsp

<body>

<%

SimpleDateFormat sdf = new SimpleDateFormat("yyyy-MM-dd");

int id = Integer.parseInt(request.getParameter("id"));

Board board = BoardDao.getInstance().selectOne(id);

board.setHit(board.getHit() + 1);

BoardDao.getInstance().updateBoard(board);

%>


<table width="300">

<tr>

<td align="center" width="100" bgcolor="skyblue">제목 :<%=board.getTitle()%></th><br>

</tr>

<tr>

<td align="center" width="100" bgcolor="skyblue">작성자 :<%=board.getWriter()%></th><br>

</tr>

<tr>

<th align="center" width="100" bgcolor="skyblue">내용</th>

</tr>

<tr>

<th align="center" width="100" bgcolor="skyblue"><textarea name="content" rows="13" cols="40"><%=board.getContent()%></textarea></th>

</tr>

<tr>

<th align="right" width="100" bgcolor="skyblue"><%=sdf.format(board.getDate())%></th>

</tr>

<tr>

<th align="right" width="100">

<input type="button" value="처음으로"

  onclick="location.href='/JSP_Board/list.jsp'">

  <input type="button" value="삭제"

  onclick="location.href='/JSP_Board/delete.jsp?id=<%=id%>'">

  <input type="button" value="수정"

  onclick="location.href='/JSP_Board/updateForm.jsp?id=<%=id%>'">

  </th>

 

</tr>

</table>

</body>


여기서도 마찬가지로 삭제, 수정 버튼클릭시 넘어가는 주소에다가 id를 파라미터로 작성해서 넘겨준다.



삭제 버튼 눌렸을 시

delete.jsp

<body>

<%

int id = Integer.parseInt(request.getParameter("id"));

BoardDao.getInstance().deleteBoard(id);

response.sendRedirect("/JSP_Board/list.jsp");

%>

</body>

dao클래스로 파라미터로 가져온 아이디 값을 가지고 있는 글을 불러내서 삭제한다.


수정버튼 눌렸을 시

updateForm.jsp

<body>

<%

int id = Integer.parseInt(request.getParameter("id"));

Board board = BoardDao.getInstance().selectOne(id);

%>

<center>

<table>


<form action="update.jsp">

<input type="hidden" name="id" value="<%=board.getId() %>">

<tr>

<td width="800" align="center" bgcolor="skyblue">제목 : <input type="text" name="title" value="<%=board.getTitle()%>"></td>

</tr>

<tr>

<td width="800" align="center" bgcolor="skyblue">작성자 : <input type="text" name="writer" value="<%=board.getWriter()%>"><br></td>

</tr>

<tr>

<td width="800" align="center" bgcolor="skyblue">내용</td>

</tr>

<tr>

<td height="400" align="center" bgcolor="skyblue"><textarea name="content" style="width: 100%; height: 100%;"><%=board.getContent()%></textarea></td>

</tr>

<tr>

<th align="right" bgcolor="skyblue"><input type="submit" value="수정">

<input type="button" value="취소" onclick="history.back()"></th>

</tr>

</form>


</table>

</center>


</body>

마찬가지로 여기서도 파라미터에 id값을 입력해서 update.jsp로 넘겨준다.

수정을 눌렀을때 기존의 있던 제목,내용,작성자 값들을 보여주고 수정가능하게 한다.

취소를 누르면 전페이지로 돌아간다.


수정을 눌렀을때 수정을 처리해줄 페이지로 이동

*update.jsp

<body>

<%

request.setCharacterEncoding("UTF-8");

int id = Integer.parseInt(request.getParameter("id"));

Date date = new Date(System.currentTimeMillis());

String title = request.getParameter("title");

String writer = request.getParameter("writer");

String content = request.getParameter("content");

Board board = BoardDao.getInstance().selectOne(id);

board.setTitle(title);

board.setWriter(writer);

board.setContent(content);

board.setDate(date);

BoardDao.getInstance().updateBoard(board);

response.sendRedirect("/JSP_Board/boardInfo.jsp?id=" + id);

%>

</body>

수정 요청을 처리해주고 다시 게시글 정보 페이지로 이동!

수정된것을 확인해본다.


다시 처음부분으로 돌아가서

list.jsp에서 글입력 버튼을 눌렀을때

제목,작성자,내용을 입력할 수 있는

*writeForm.jsp

<body>


<center>


<table>


<form action="boardAdd.jsp">

<tr>

<td width="800" align="center" bgcolor="skyblue">제목 : <input type="text" name="title"></td>

</tr>

<tr>

<td width="800" align="center" bgcolor="skyblue">작성자 : <input type="text" name="writer"><br></td>

</tr>

<tr>

<td width="800" align="center" bgcolor="skyblue">내용</td>

</tr>

<tr>

<td  height="400" align="center" bgcolor="skyblue"><textarea name="content" style="width: 100%; height: 100%;"></textarea></td>

</tr>

<tr>

<th align="right" bgcolor="skyblue"><input type="submit" value="확인">

<input type="button" value="취소"

  onclick="location.href='/JSP_Board/list.jsp'"></th>

</tr>

</form>


</table>


</center>


</body>

취소 버튼 눌렀을 시 list.jsp로 돌아간다.

글입력후 확인버튼을 눌렀을 시 데이터베이스에 저장을 처리해줄

*boardAdd.jsp

<body>

<%

request.setCharacterEncoding("UTF-8");

String title = request.getParameter("title");

String writer = request.getParameter("writer");

String content = request.getParameter("content");

Board board = new Board();

board.setTitle(title);

board.setWriter(writer);

board.setContent(content);

BoardDao.getInstance().insertBoard(board);

response.sendRedirect("/JSP_Board/list.jsp");

%>

</body>


이렇게하면 간단한 읽고,쓰고,삭제,수정 기능이 담긴 게시판이 완성된다.

디자인은 나름 심플하게 한다고 한것인데 감각이 없어서 ..

개인의 취향대로 수정해주면 될듯 합니다.

저작자표시

'[JSP]' 카테고리의 다른 글

[JSP]11월 4일 EL표현식과 JSTL 제어문(taglib)  (0) 2015.11.04
[JSP]11월 4일 Servlet, EL표현식, JSTL제어문을 사용해 게시판 만들기 예제(jsp 파일에 JAVA 코드 다 빼고!)  (0) 2015.11.04
[JSP] 10월 29일 세션(session)  (0) 2015.10.30
[JSP]10월 28일 JSP에서 DB(데이터베이스)에 저장하기 예제.  (0) 2015.10.30
[JSP]10월 28일 CookieBox 만들기예제  (0) 2015.10.30

'[JSP]' Related Articles

티스토리툴바