Skip to content

Commit

Permalink
MvcWeb-day03
Browse files Browse the repository at this point in the history
  • Loading branch information
@respect98
respect98 committed Dec 18, 2022
1 parent 3de11d4 commit 7b3cca4
Show file tree
Hide file tree
Showing 7 changed files with 484 additions and 0 deletions.
19 changes: 19 additions & 0 deletions MvcWeb/board.sql
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,19 @@
drop table board;

-- 단순형 게시판(파일첨부 기능)
create table board(
num number(8) primary key, -- 글번호
userid varchar2(30) not null, --작성자 아이디
subject varchar2(200), --제목
content varchar2(2000), -- 글 내용
wdate timestamp default systimestamp, --작성일
filename varchar2(300), --첨부 파일명
filesize number(8)--첨부파일 크기
);

drop sequence board_seq;

create sequence board_seq
start with 1
increment by 1
nocache;
99 changes: 99 additions & 0 deletions MvcWeb/boardEdit.jsp
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,99 @@
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>

<jsp:include page="/top.jsp"/>
<style>
#boardFrm li{
padding: 10px 5px;
text-align: left;
}
ul li{
list-style-type: none;
}
#subject, #content, #filename{
width: 98%;
}
#boardFrm input{
padding: 5px;
}
div.bbs{
width:90%;
margin: auto;
}
.btn{
padding: 4px;
background-color: #efefef;
border: 1px solid silver;
width: 200px;
}
</style>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.1/jquery.min.js"></script>
<script src="https://cdn.ckeditor.com/4.20.0/standard/ckeditor.js"></script>

<script>
$(function(){
CKEDITOR.replace("content")
})
let board_check=function(){
if($('#subject').val()==''){
alert('제목을 입력하세요');
$('#subject').focus();
return false;
}
if(!CKEDITOR.instances.content.getData()){
alert('글 내용을 입력하세요');
CKEDITOR.instances.content.focus();
return false;
}
return true;
}
</script>

<div class="container">
<h1>Board 글수정</h1>

<c:if test="${board==null}">
<script>
alert('해당 글은 없습니다');
history.back();
</script>
</c:if>
<c:if test="${board!=null}">
<div class="bbs">
<form name="boardF" id="boardFrm" action="boardEditEnd.do"
method="POST" enctype="multipart/form-data"
onsubmit="return board_check()">
<!-- ---------------------------------------------- -->
<input type="hidden" name="num" value="${board.num}">
<!-- ---------------------------------------------- -->
<ul>
<li>제목</li>
<li>
<input type="text" name="subject" value="${board.subject}" id="subject" placeholder="Subject">
</li>
<li>글내용</li>
<li>
<textarea name="content" id="content" rows="10" cols="50"
placeholder="Content">${board.content}</textarea>
</li>
<li>첨부파일</li>
<li>
${board.filename} [${board.filesize} bytes]<br>
<input type="file" name="filename" id="filename"><br>
<!-- 예전에 첨부했던 파일명을 old_file 이란 이름으로 넘기자------------ -->
<input type="hidden" name="old_file" value="${board.filename}">
<!-- ---------------------------------------------------------- -->
</li>
<li>
<button class='btn'>글 수정</button>
<button type="reset" class='btn'>다시 쓰기</button>
</li>
</ul>
</form>
</div>
</c:if>
</div>
<jsp:include page="/foot.jsp"/>
162 changes: 162 additions & 0 deletions MvcWeb/boardList.jsp
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,162 @@
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<jsp:include page="/top.jsp"/>
<style>
#boardWrap{
width: 94%;
margin:auto;
padding-top:1em;
}
#boardList>li{
list-style-type: none;
float:left;
height:40px;
line-height:40px;
border-bottom: 1px solid #ddd;
width:15%;
}
#boardList>li:nth-child(4n+2){
width:55%;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
/*제목 텍스트가 오버플로우 될 경우 말줄임표로 출력*/
}
#boardList a:link, #boardList a:visited, #boardList a:hover{
text-decoration: none;
}
.pageWrap{
position:relative;
}
.paging{
list-style-type:none;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
.paging>li{
float:left;
padding: 5px;
text-align: center;
width:2em;
border: 1px solid #ddd;
border-radius: 3px;
margin:1px;
}
.paging>li.current{
background-color: navy;
}
.paging>li.current a{
color:white;
}
</style>
<script>
function find_check(){
//alert(searchF.findKeyword.value)
let $keyword=$('#findKeyword');
//alert($keyword.val());
if(!$keyword.val()){
alert('검색어를 입력하세요');
$keyword.focus();
return false;
}
return true;
}//------------------------------
</script>
<div class="container">
<h1>Board List</h1>
<br>
<p>
<a href="boardWrite.do">글쓰기</a>|<a href="boardList.do">글목록</a>

<%-- <h3>총 게시글 수: ${totalCount} 개</h3> --%>
<%-- ${boardArr} --%>

</p>
<br>
<div id="boardWrap">
<div id="boardSearch">
<form name="searchF" id="searchF" action="boardList.do" method="get" onsubmit="return find_check()">
<select name="findType" style="padding:5px">
<option value="1">제 목</option>
<option value="2">작성자</option>
<option value="3">글내용</option>
</select>
<input type="text" name="findKeyword" id="findKeyword" class="m2">
<button style="padding:5px">Search</button>
</form>
</div>

<ul id="boardList" class="boardList">
<li>번호</li>
<li>제목</li>
<li>글쓴이</li>
<li>등록일</li>
<!-- ----------------------------------- -->
<c:forEach var="vo" items="${boardArr}">
<!--forEach태그의 속성들
var : 변수명을 지정한다
items : 자료구조(ArrayList, Map...)
begin : 시작값
end : 끝값
step: 증가치
varStatus: 반복문의 상태정보를 담아줄 변수명을 지정
- count: 반복문 횟수 1~
- index : 인덱스번호 0~
-->
<li>${vo.num}</li>
<li>
<a href="boardView.do?num=${vo.num}">${vo.subject}</a>

<c:if test="${vo.filesize > 0}">
<img src="images/attach.jpg" width="16px">
</c:if>


</li>
<li>
${vo.userid}
</li>
<li>
<fmt:formatDate value="${vo.wdate}" pattern="yyyy-MM-dd"/>
</li>
</c:forEach>
<!-- ----------------------------------- -->
</ul>
<div style="clear:both"></div>
<br><br>
<div class="pageWrap">
<ul class="paging">
<li><a href="boardList.do?cpage=${cpage-1}${qStr}">◀</a></li>

<c:forEach var="i" begin="1" end="${pageCount}">
<c:if test="${cpage == i}">
<li class="current"><a href="boardList.do?cpage=${i}${qStr}">${i}</a></li>
</c:if>
<c:if test="${cpage != i}">
<li><a href="boardList.do?cpage=${i}${qStr}">${i}</a></li>
</c:if>
</c:forEach>

<li><a href="boardList.do?cpage=${cpage+1}${qStr}">▶</a></li>
</ul>
</div>
<br><br>
<div>
총 게시글 수: ${totalCount}개, 현재 <span style="color:red">${cpage}</span> / 총 ${pageCount} pages
</div>



</div>

</div>
<jsp:include page="/foot.jsp"/>
80 changes: 80 additions & 0 deletions MvcWeb/boardView.jsp
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,80 @@
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>

<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>

<jsp:include page="/top.jsp"/>
<div class="container">
<h1>Board 글보기</h1>
<br>
<a href="boardWrite.do">글쓰기</a>|
<a href="boardList.do">글목록</a>
<br>
<br>
<table border="1" style="width:90%;margin:auto">
<tr>
<td width="20%"><b>글번호</b></td>
<td width="30%">${board.getNum()}</td>
<td width="20%"><b>작성일</b></td>
<td width="30%">
<fmt:formatDate value="${board.wdate}" pattern="yyyy-MM-dd HH:mm"/>
</td>
</tr>

<tr>
<td width="20%"><b>글쓴이</b></td>
<td width="30%">${board.userid}</td>
<td width="20%"><b>첨부파일</b></td>
<td width="30%">

<a href="Upload/${board.filename}" download>
<img src="images/attach.jpg" width="20px"> ${board.filename}</a>

[ ${board.filesize} bytes] </td>
</tr>
<tr>
<td width="20%"><b>제목</b></td>
<td colspan="3">
${board.subject}
</td>
</tr>
<tr>
<td width="20%"><b>글내용</b></td>
<td colspan="3" style="height:300px">
${board.content}
</td>
</tr>
<tr>
<td colspan="4">
<a href="boardList.do">글목록</a>|
<a href="#" onclick="goEdit()">수정</a>|
<a href="javascript:goDel()">삭제</a>
</td>
</tr>
</table>
</div>
<!-- 수정 또는 삭제를 위한 form--------------------- -->
<form name="bf" id="bf">
<input type="hidden" name="num" id="num" value="${board.num}">
</form>
<!-- ------------------------------- -->

<script>
function goEdit(){
bf.action="boardEditForm.do";
bf.method='post';
bf.submit();
}
function goDel(){
bf.action="boardDel.do";
bf.method='post';
bf.submit();
}
</script>
<jsp:include page="/foot.jsp"/>




0 comments on commit 7b3cca4

Please sign in to comment.