Programming/JSP

[JSP] 게시판 CRUD 연결하기

너굴위 2023. 9. 27. 16:38
728x90
반응형

< 지난 포스팅 정리 >

게시판 (BBS - Communication / Community)

            => 웹 프로그램 시작 / 끝

            => 소스 통채로 암기

            게시판 => 웹 CRUD (DML)

                        => 목록형 - 회원목록, 상품목록, 주문목록 ..

* 웹 디자인 템플리트 - html화 된 디자인

* 팀 프로젝트 할 때는 html까지 직접 만들기 때문에 해당 언어들을 잘 알아야 함.

 

1. ERD

2. 페이지 네비게이션(페이지간의 흐름: 화면전환)

                DFD(Data Flow Diagram)  => 다른 사이트를 벤치마킹

글 목록: board_list1.jsp  (x)

  글 쓰기: board_write1.jsp    -- (입력 내용) -->   board_write1_ok.jsp(DB) :숨겨진 페이지     -(x)->  board_list1.jsp

   (pk:seq) -> pk를 기준으로 글 상세 화면을 띄울 수 있도록 함.

글 상세: board_view1.jsp 

      (pk:seq)  -> pk 기준 수정

     -> 글 수정: board_modify1.jsp    (seq, 비밀번호, 입력내용)   board_modify1_ok.jsp(DB) -(seq)-> board_view1.jsp

      (pk:seq)  -> pk 기준 삭제

     -> 글 삭제: board_delete1.jsp     (seq, 비밀번호)   board_delete1_ok.jsp(DB)  --(x)--> board_list1.jsp

 

 

DFD흐름도&nbsp; &nbsp;출처:https://blog.naver.com/PostView.naver?blogId=kkson50&logNo=221727986981

 

 


< 제작 순서 >

board_write1.jsp    board_write1_ok.jsp

board_list1.jsp(1차)

board_view1.jsp

          board_modify1.jsp      board_modify1_ok.jsp      

          board_delete1.jsp       board_delete1_ok.jsp      

board_list1.jsp(2차)


< 게시판 코딩 >

 

확인사항

* pooling 사용하려면 서버 꺼야함

* pooling context.xml의 name은 프로젝트들이 많으면 각각 이름을 달리하는 것이 좋다.

* 오류발생하면 해당 페이지의 f12를 통해 개발자 도구 콘솔을 확인하도록 한다.

 

board_write1.jsp  - 예외처리와 html디자인
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<title>Insert title here</title>
<link rel="stylesheet" type="text/css" href="../../css/board.css">
<script type="text/javascript"> //예외처리부분
window.onload = function(){
document.getElementById('wbtn').onclick = function(){
//alert('click'); // 이벤트 동작 확인
if(document.wfrm.info.checked == false){
alert('동의를 하셔야 합니다.');
return;
}
if(document.wfrm.writer.value.trim()==''){
alert('글쓴이를 입력 하셔야 합니다.');
return;
}
if(document.wfrm.password.value.trim()==''){
alert('비밀번호를 입력 하셔야 합니다.');
return;
}
document.wfrm.submit();

};
};
</script>
</head>


<body>
<!-- 상단 디자인 -->
<div class="con_title">
<h3>게시판</h3>
<p>HOME &gt; 게시판 &gt; <strong>게시판</strong></p>
</div>
<div class="con_menu"></div>
<div class="con_txt">
<form action="./board_write1_ok.jsp" method="post" name="wfrm">
<div class="contents_sub">
<!--게시판-->
<div class="board_write">
<table>
<tr>
<th class="top">글쓴이</th>
<td class="top"><input type="text" name="writer" value="" class="board_view_input_mail" maxlength="5" /></td>
</tr>
<tr>
<th>제목</th>
<td><input type="text" name="subject" value="" class="board_view_input" /></td>
</tr>
<tr>
<th>비밀번호</th>
<td><input type="password" name="password" value="" class="board_view_input_mail"/></td>
</tr>
<tr>
<th>내용</th>
<td><textarea name="content" class="board_editor_area"></textarea></td>
</tr>
<tr>
<th>이메일</th>
<td><input type="text" name="mail1" value="" class="board_view_input_mail"/> @ <input type="text" name="mail2" value="" class="board_view_input_mail"/></td>
</tr>
</table>

<table>
<tr>
<br />
<td style="text-align:left;border:1px solid #e0e0e0;background-color:f9f9f9;padding:5px">
<div style="padding-top:7px;padding-bottom:5px;font-weight:bold;padding-left:7px;font-family: Gulim,Tahoma,verdana;">※ 개인정보 수집 및 이용에 관한 안내</div>
<div style="padding-left:10px;">
<div style="width:97%;height:95px;font-size:11px;letter-spacing: -0.1em;border:1px solid #c5c5c5;background-color:#fff;padding-left:14px;padding-top:7px;">
1. 수집 개인정보 항목 : 회사명, 담당자명, 메일 주소, 전화번호, 홈페이지 주소, 팩스번호, 주소 <br />
2. 개인정보의 수집 및 이용목적 : 제휴신청에 따른 본인확인 및 원활한 의사소통 경로 확보 <br />
3. 개인정보의 이용기간 : 모든 검토가 완료된 후 3개월간 이용자의 조회를 위하여 보관하며, 이후 해당정보를 지체 없이 파기합니다. <br />
4. 그 밖의 사항은 개인정보취급방침을 준수합니다.
</div>
</div>
<div style="padding-top:7px;padding-left:5px;padding-bottom:7px;font-family: Gulim,Tahoma,verdana;">
<input type="checkbox" name="info" value="1" class="input_radio"> 개인정보 수집 및 이용에 대해 동의합니다.
</div>
</td>
</tr>
</table>
</div>

<div class="btn_area">
<div class="align_left">
<input type="button" value="목록" class="btn_list btn_txt02" style="cursor: pointer;" onclick="location.href='board_list1.jsp'" />
</div>
<div class="align_right">
<input type="button" id="wbtn" value="쓰기" class="btn_write btn_txt01" style="cursor: pointer;" /> <!-- 입력값 체크 후 내용 입력 -->
</div>
</div>
<!--//게시판-->
</div>
</form>
</div>
<!-- 하단 디자인 -->


</body>
</html>

 

board_write1_ok.jsp  - 쓰기 버튼 클릭하면 DB에 데이터를 저장
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>

<%@ page import="javax.naming.Context" %>
<%@ page import="javax.naming.InitialContext" %>
<%@ page import="javax.naming.NamingException" %>


<%@ page import="javax.sql.DataSource" %>




<%@ page import="java.sql.Connection" %>
<%@ page import="java.sql.SQLException" %>
<%@ page import="java.sql.PreparedStatement"%>



<%

request.setCharacterEncoding("utf-8"); //내용을 파라미터로 가져온다 (파라미터로 name명을 작성하면 된다.)
String subject = request.getParameter("subject");
String writer = request.getParameter("writer");
String mail ="";
if(!request.getParameter("mail1").equals("")&&!request.getParameter("mail1").equals("")){ //메일의 @으로 인해 잘못된 입력이 생길 수 있기 때문에 예외처리를 해준다.
mail=request.getParameter("mail1")+"@"+request.getParameter("mail2");
}
String password = request.getParameter("password");
String content = request.getParameter("content");

String wip = request.getRemoteAddr();

/*
System.out.println(subject);
System.out.println(writer);
System.out.println(mail);
System.out.println(password);
System.out.println(content);*/

Connection conn=null;
PreparedStatement pstmt =null;

// 정상: 0 / 비정상: 1

int flag =1;

try{
Context initCtx = new InitialContext();
Context envCtx =(Context)initCtx.lookup("java:comp/env");
DataSource dataSource = (DataSource)envCtx.lookup("jdbc/mariadb3");
conn = dataSource.getConnection();

String sql ="insert into board1 values (0,?,?,0,?,?,?,?,now()) "; //DB에서 넣는 내용과 폼을 통해 입력하는 내용을 구분하여 적어야 한다
pstmt =conn.prepareStatement(sql);
pstmt.setString(1,subject);
pstmt.setString(2,writer);
pstmt.setString(3,password);
pstmt.setString(4,content);
pstmt.setString(5,mail);
pstmt.setString(6,wip);

if(pstmt.executeUpdate()==1){ //쿼리 업데이트 내용이 1이면 정상적으로 등록되었다는 flag=0으로 설정한다.
flag=0;
}


} catch(NamingException e){
System.out.println( "[에러] " + e.getMessage() );
} catch(SQLException e){
System.out.println( "[에러] " + e.getMessage() );
} finally{
if(pstmt!=null)pstmt.close();
if(conn!=null)conn.close();
}


out.println("<script type='text/javascript'>");
if(flag ==0){
//정상
out.println("alert('글쓰기 성공');");
out.println("location.href='./board_list1.jsp';");
}else if(flag==1){
//에러
out.println("alert('글쓰기 실패');");
out.println("history.back();");
}
out.println("</script>");
%>

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>


</body>
</html>

 

board_list1.jsp - 글 목록 만들기
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@ page import="javax.naming.Context" %>
<%@ page import="javax.naming.InitialContext" %>
<%@ page import="javax.naming.NamingException" %>


<%@ page import="javax.sql.DataSource" %>


<%@ page import="java.sql.Connection" %>
<%@ page import="java.sql.SQLException" %>
<%@ page import="java.sql.PreparedStatement"%>
<%@ page import="java.sql.ResultSet"%>


<%


Connection conn=null;
PreparedStatement pstmt =null;
ResultSet rs = null;


int totalRecord=0;


StringBuilder sbHtml = new StringBuilder();


try{
Context initCtx = new InitialContext();
Context envCtx =(Context)initCtx.lookup("java:comp/env");
DataSource dataSource = (DataSource)envCtx.lookup("jdbc/mariadb3");
conn = dataSource.getConnection();

//datediff를 통해 현재날짜와 글 등록 날짜 사이의 차이를 계산하여 24시간 이내에 작성된 글인지 확인할 수 있다.
String sql = "select seq, subject, writer, date_format(wdate,'%Y-%m-%d') wdate, hit, datediff(now(),wdate)wgap from board1 order by seq desc"; //글 등록번호를 기준으로 목록을 내림차순 정리
pstmt = conn.prepareStatement(sql);


rs = pstmt.executeQuery();

//데이터의 총 개수
rs.last();
totalRecord= rs.getRow();
rs.beforeFirst();

while(rs.next()){ //데이터를 읽고 append를 통해 표 형식으로 출력
String seq = rs.getString("seq");
String subject = rs.getString("subject");
String writer = rs.getString("writer");
String wdate = rs.getString("wdate");
String hit = rs.getString("hit");
int wgap = rs.getInt("wgap");

sbHtml.append("<tr>");
sbHtml.append("<td>&nbsp;</td>");
sbHtml.append("<td>"+seq+"</td>");
sbHtml.append("<td class='left'>");
sbHtml.append("<a href='board_view1.jsp?seq="+seq+"'>"+subject+"</a>&nbsp;");
if(wgap==0){
sbHtml.append("<img src='../../images/icon_new.gif' alt='NEW'>"); //조건에 따라 html태그도 뺐다가 넣었다가 할 수 있다.
}
sbHtml.append("</td>"); //get방식으로 seq를 가지고 감(공백 없이 가지고 가야함)
sbHtml.append("<td>"+writer+"</td>"); //nbsp (스페이스바)
sbHtml.append("<td>"+wdate+"</td>");
sbHtml.append("<td>"+hit+"</td>");
sbHtml.append("<td>&nbsp;</td>");
sbHtml.append("</tr>");
}

} catch(NamingException e){
System.out.println( "[에러] " + e.getMessage() );
} catch(SQLException e){
System.out.println( "[에러] " + e.getMessage() );
} finally {
if(rs!=null)rs.close();
if(pstmt!=null)pstmt.close();
if(conn!=null)conn.close();
}
%>

<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<title>Insert title here</title>
<link rel="stylesheet" type="text/css" href="../../css/board.css">
</head>


<body>
<!-- 상단 디자인 -->
<div class="con_title">
<h3>게시판</h3>
<p>HOME &gt; 게시판 &gt; <strong>게시판</strong></p>
</div>
<div class="con_txt">
<div class="contents_sub">
<div class="board_top">
<div class="bold"><span class="txt_orange"><%=totalRecord %></span></div> <!-- 데이터의 총 개수를 구함 -->
</div>


<!--게시판-->
<div class="board">
<table>
<tr>
<th width="3%">&nbsp;</th>
<th width="5%">번호</th>
<th>제목</th>
<th width="10%">글쓴이</th>
<th width="17%">등록일</th>
<th width="5%">조회</th>
<th width="3%">&nbsp;</th>
</tr>
<!-- 시작 -->
<%=sbHtml.toString() %>
<!---->
</table>
</div>


<div class="btn_area">
<div class="align_right">
<input type="button" value="쓰기" class="btn_write btn_txt01" style="cursor: pointer;" onclick="location.href='board_write1.jsp'" />
</div>
</div>
<!--//게시판-->
</div>
</div>
<!--//하단 디자인 -->


</body>
</html>

new이모티콘 띄울 수 있도록 하기

 

board_view1.jsp - 등록번호를 통해 게시물의 상세 내용 불러오기
<%@page import="java.sql.Connection"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@ page import="javax.naming.Context" %>
<%@ page import="javax.naming.InitialContext" %>
<%@ page import="javax.naming.NamingException" %>


<%@ page import="javax.sql.DataSource" %>


<%@ page import="java.sql.Connection" %>
<%@ page import="java.sql.SQLException" %>
<%@ page import="java.sql.PreparedStatement"%>
<%@ page import="java.sql.ResultSet"%>

<%
request.setCharacterEncoding("utf-8");


String seq = request.getParameter("seq"); //파라미터를 넘겨 등록 번호를 변수에 저장
System.out.println(seq);

String subject="";
String writer ="";
String mail="";
String wip="";
String hit="";
String content="";
String wdate="";


Connection conn=null;
PreparedStatement pstmt =null;
ResultSet rs = null;


try{
Context initCtx = new InitialContext();
Context envCtx =(Context)initCtx.lookup("java:comp/env");
DataSource dataSource = (DataSource)envCtx.lookup("jdbc/mariadb3");
conn = dataSource.getConnection();

String sql = "update board1 set hit=hit+1 where seq=?";
pstmt = conn.prepareStatement(sql);
pstmt.setString(1,seq);

pstmt.executeUpdate();

sql ="select seq, subject, writer, mail, wip, wdate, hit, content from board1 where seq=?";
pstmt = conn.prepareStatement(sql);
pstmt.setString(1,seq);

rs = pstmt.executeQuery();
//데이터가 하나이기 때문에 while사용할 필요 없음
if(rs.next()){
subject= rs.getString("subject");
writer =rs.getString("writer");
mail=rs.getString("mail");
wip=rs.getString("wip");
hit=rs.getString("hit");
content=rs.getString("content") == null? "": rs.getString("content").replaceAll("\n","<br />"); //엔터키를 html에서는 br로 인식하여 엔터키로 받을 수 있도록 문자열의 형태를 변경한다.
wdate=rs.getString("wdate");
}

} catch(NamingException e){
System.out.println( "[에러] " + e.getMessage() );
} catch(SQLException e){
System.out.println( "[에러] " + e.getMessage() );
} finally {
if(rs!=null)rs.close();
if(pstmt!=null)pstmt.close();
if(conn!=null)conn.close();
}

%>


<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<title>Insert title here</title>
<link rel="stylesheet" type="text/css" href="../../css/board.css">
</head>


<body>
<!-- 상단 디자인 -->
<div class="con_title">
<h3>게시판</h3>
<p>HOME &gt; 게시판 &gt; <strong>게시판</strong></p>
</div>
<div class="con_txt">
<div class="contents_sub">
<!--게시판-->
<div class="board_view">
<table>
<tr>
<th width="10%">제목</th>
<td width="60%"><%=subject %></td>
<th width="10%">등록일</th>
<td width="20%"><%=wdate %></td>
</tr>
<tr>
<th>글쓴이</th>
<td><%=writer %>(<%=mail %>)(<%=wip %>)</td>
<th>조회</th>
<td><%=hit %></td>
</tr>
<tr>
<td colspan="4" height="200" valign="top" style="padding: 20px; line-height: 160%"><%=content %></td>
</tr>
</table>
</div>


<div class="btn_area">
<div class="align_left">
<input type="button" value="목록" class="btn_list btn_txt02" style="cursor: pointer;" onclick="location.href='board_list1.jsp'" />
</div>
<div class="align_right">
<input type="button" value="수정" class="btn_list btn_txt02" style="cursor: pointer;" onclick="location.href='board_modify1.jsp?seq=<%=seq %>'" />
<input type="button" value="삭제" class="btn_list btn_txt02" style="cursor: pointer;" onclick="location.href='board_delete1.jsp?seq=<%=seq %>'" />
<input type="button" value="쓰기" class="btn_write btn_txt01" style="cursor: pointer;" onclick="location.href='board_write1.jsp'" />
</div>
</div>
<!--//게시판-->
</div>
</div>
<!-- 하단 디자인 -->


</body>
</html>

 

board_delete1.jsp - 삭제 폼 만들기
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!-- database에 있는 내용을 가지고 오거나 넣을 때 해당 import를 넣어 적용할 수 있도록 한다. -->
<%@ page import="javax.naming.Context" %>
<%@ page import="javax.naming.InitialContext" %>
<%@ page import="javax.naming.NamingException" %>


<%@ page import="javax.sql.DataSource" %>




<%@ page import="java.sql.Connection" %>
<%@ page import="java.sql.SQLException" %>
<%@ page import="java.sql.PreparedStatement"%>
<%@ page import="java.sql.ResultSet"%>

<%
request.setCharacterEncoding("utf-8");
String seq= request.getParameter("seq"); //seq파라미터를 가져온다.

String subject ="";
String writer="";

Connection conn=null;
PreparedStatement pstmt =null;
ResultSet rs = null;


try{
Context initCtx = new InitialContext();
Context envCtx =(Context)initCtx.lookup("java:comp/env");
DataSource dataSource = (DataSource)envCtx.lookup("jdbc/mariadb3");
conn = dataSource.getConnection();

String sql = "select subject, writer from board1 where seq=?"; //seq를 파라미터로 넘겨서 해당 seq에 맞는 subject와 writer을 가져와 hmtl에 set한다.
pstmt = conn.prepareStatement(sql);
pstmt.setString(1,seq);

rs=pstmt.executeQuery();

if(rs.next()){
subject= rs.getString("subject");
writer =rs.getString("writer");
}

}catch(NamingException e){
System.out.println( "[에러] " + e.getMessage() );
} catch(SQLException e){
System.out.println( "[에러] " + e.getMessage() );
} finally{
if(rs!=null)pstmt.close();
if(pstmt!=null)pstmt.close();
if(conn!=null)conn.close();
}

%>

<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<title>Insert title here</title>
<link rel="stylesheet" type="text/css" href="../../css/board.css">
<script type ="text/javascript">
window.onload=function(){
document.getElementById('dbtn').onclick=function(){
//alert('click');
if(document.dfrm.password.value.trim()==''){
alert('비밀번호를 입력하셔야 합니다.');
return;
}
document.dfrm.submit();
};
};
</script>
</head>


<body>
<!-- 상단 디자인 -->
<div class="con_title">
<h3>게시판</h3>
<p>HOME &gt; 게시판 &gt; <strong>게시판</strong></p>
</div>
<div class="con_txt">
<form action="./board_delete1_ok.jsp" method="post" name="dfrm">
<input type="hidden" name = "seq" value="<%=seq %>"/> <!-- seq디자인은 없지만 값을 전달하기 위해서는 html안에 input형식으로 넣도록 한다. -->
<div class="contents_sub">
<!--게시판-->
<div class="board_write">
<table>
<tr>
<th class="top">글쓴이</th>
<td class="top"><input type="text" name="writer" value="<%=writer %>" class="board_view_input_mail" maxlength="5" readonly/></td>
</tr>
<tr>
<th>제목</th>
<td><input type="text" name="subject" value="<%=subject %>" class="board_view_input" readonly/></td>
</tr>
<tr>
<th>비밀번호</th>
<td><input type="password" name="password" value="" class="board_view_input_mail"/></td> <!-- 받는 내용 -->
</tr>
</table>
</div>

<div class="btn_area">
<div class="align_left">
<input type="button" value="목록" class="btn_list btn_txt02" style="cursor: pointer;" onclick="location.href='board_list1.jsp'" />
<input type="button" value="보기" class="btn_list btn_txt02" style="cursor: pointer;" onclick="location.href='board_view1.jsp?seq=<%=seq %>'" />
</div>
<div class="align_right">
<input type="button" id="dbtn" value="삭제" class="btn_write btn_txt01" style="cursor: pointer;" />
</div>
</div>
<!--//게시판-->
</div>
</form>
</div>
<!-- 하단 디자인 -->


</body>
</html>

 

board_delete1_ok.jsp - seq를 가지고 글을 삭제할 수 있도록 함
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>


<%@ page import="javax.naming.Context" %>
<%@ page import="javax.naming.InitialContext" %>
<%@ page import="javax.naming.NamingException" %>


<%@ page import="javax.sql.DataSource" %>




<%@ page import="java.sql.Connection" %>
<%@ page import="java.sql.SQLException" %>
<%@ page import="java.sql.PreparedStatement"%>


<%
request.setCharacterEncoding("utf-8");

String seq = request.getParameter("seq");
String password = request.getParameter("password");

//System.out.println(seq);
//System.out.println(password);

Connection conn = null;
PreparedStatement pstmt = null;

//flag가 2면 시스템 오류
//0이면 정상삭제
//1이면 비밀번호 오류
int flag =2;


try{
Context initCtx = new InitialContext();
Context envCtx =(Context)initCtx.lookup("java:comp/env");
DataSource dataSource = (DataSource)envCtx.lookup("jdbc/mariadb3");
conn = dataSource.getConnection();

//비밀번호를 프로그램으로 가져오지 말 것...
//비밀번호 암호화 필수
String sql = "delete from board1 where seq=? and password=?"; //db안에서 비교할 수 있도록 함
// 결과는 0아니면 1로 나뉘어 진다.
pstmt = conn.prepareStatement(sql);
pstmt.setString(1,seq);
pstmt.setString(2,password);

int result = pstmt.executeUpdate();
if(result==0){
//비밀번호 오류
flag=1;
}else if(result==1){
//정상 삭제
flag=0;
}
out.println("<script type='text/javascript'>");
if(flag ==0){
//정상
out.println("alert('글삭제 성공');");
out.println("location.href='./board_list1.jsp';");
}else if(flag==1){
//비밀번호 오류
out.println("alert('비밀번호 오류');");
out.println("history.back();");
}else if(flag==2){
//오류
out.println("alert('글삭제 실패');");
out.println("history.back();");
}
out.println("</script>");


} catch(NamingException e){
System.out.println( "[에러] " + e.getMessage() );
} catch(SQLException e){
System.out.println( "[에러] " + e.getMessage() );
} finally{
if(pstmt!=null)pstmt.close();
if(conn!=null)conn.close();
}



%>

 

board_modify1.jsp - 수정 폼 만들기
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@ page import="javax.naming.Context" %>
<%@ page import="javax.naming.InitialContext" %>
<%@ page import="javax.naming.NamingException" %>


<%@ page import="javax.sql.DataSource" %>




<%@ page import="java.sql.Connection" %>
<%@ page import="java.sql.SQLException" %>
<%@ page import="java.sql.PreparedStatement"%>
<%@ page import="java.sql.ResultSet"%>




<%
request.setCharacterEncoding("utf-8");
String seq= request.getParameter("seq"); //seq파라미터를 가져온다.

String subject ="";
String writer="";
String content="";
String mail[]=null; //메일을 @을 기준으로 앞뒤를 나눠야하기 때문에 배열을 사용하여 각 부분들을 담는다.

//글쓴이 제목 내용 이메일 채워져서 나옴 (비밀번호 빼고)

Connection conn=null;
PreparedStatement pstmt =null;
ResultSet rs = null;


try{
Context initCtx = new InitialContext();
Context envCtx =(Context)initCtx.lookup("java:comp/env");
DataSource dataSource = (DataSource)envCtx.lookup("jdbc/mariadb3");
conn = dataSource.getConnection();

String sql = "select subject, writer, content, mail from board1 where seq=?"; //seq를 파라미터로 넘겨서 해당 seq에 맞는 subject와 writer을 가져와 hmtl에 set한다.
pstmt = conn.prepareStatement(sql);
pstmt.setString(1,seq);

rs=pstmt.executeQuery();

if(rs.next()){
subject= rs.getString("subject");
writer =rs.getString("writer");
content=rs.getString("content");
if(rs.getString("mail")==null){ //mail의 내용이 있다면
mail=new String[]{"",""}; //mail의 공간을 2개로 나눔 (공백으로 공간 마련하기)
}else{
mail=rs.getString("mail").split("@"); //@을 기준으로 앞뒤를 나누어 문자열을 얻어 배열에 저장
}
}

}catch(NamingException e){
System.out.println( "[에러] " + e.getMessage() );
} catch(SQLException e){
System.out.println( "[에러] " + e.getMessage() );
} finally{
if(rs!=null)pstmt.close();
if(pstmt!=null)pstmt.close();
if(conn!=null)conn.close();
}
%>






<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<title>Insert title here</title>
<link rel="stylesheet" type="text/css" href="../../css/board.css">
<script type ="text/javascript">
window.onload=function(){
document.getElementById('ubtn').onclick=function(){
//alert('click');
if(document.ufrm.password.value.trim()==''){
alert('비밀번호를 입력하셔야 합니다.');
return;
}
document.ufrm.submit();
};
};
</script>
</head>


<body>
<!-- 상단 디자인 -->
<div class="con_title">
<h3>게시판</h3>
<p>HOME &gt; 게시판 &gt; <strong>게시판</strong></p>
</div>
<div class="con_txt">
<form action="./board_modify1_ok.jsp" method="post" name="ufrm">
<input type="hidden" name = "seq" value="<%=seq %>"/>
<div class="contents_sub">
<!--게시판-->
<div class="board_write">
<table>
<tr>
<th class="top">글쓴이</th>
<td class="top"><input type="text" name="writer" value="<%=writer %>" class="board_view_input_mail" maxlength="5" readonly/></td>
</tr>
<tr>
<th>제목</th>
<td><input type="text" name="subject" value="<%=subject %>" class="board_view_input" /></td>
</tr>
<tr>
<th>비밀번호</th>
<td><input type="password" name="password" value="" class="board_view_input_mail"/></td>
</tr>
<tr>
<th>내용</th>
<td><textarea name="content" class="board_editor_area"><%=content %></textarea></td>
</tr>
<tr>
<th>이메일</th>
<td><input type="text" name="mail1" value="<%=mail[0] %>" class="board_view_input_mail"/> @ <input type="text" name="mail2" value="<%=mail[1] %>" class="board_view_input_mail"/></td>
</tr>
</table>
</div>

<div class="btn_area">
<div class="align_left">
<input type="button" value="목록" class="btn_list btn_txt02" style="cursor: pointer;" onclick="location.href='board_list1.jsp'" />
<input type="button" value="보기" class="btn_list btn_txt02" style="cursor: pointer;" onclick="location.href='board_view1.jsp'" />
</div>
<div class="align_right">
<input type="button" id="ubtn" value="수정" class="btn_write btn_txt01" style="cursor: pointer;" />
</div>
</div>
<!--//게시판-->
</div>
</form>
</div>
<!-- 하단 디자인 -->


</body>
</html>

 

 

board_modify1_of.jsp - 수정 폼에서 수정을 누르면 DB를 통해 수정하기
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>

<%@ page import="javax.naming.Context" %>
<%@ page import="javax.naming.InitialContext" %>
<%@ page import="javax.naming.NamingException" %>


<%@ page import="javax.sql.DataSource" %>


<%@ page import="java.sql.Connection" %>
<%@ page import="java.sql.PreparedStatement" %>
<%@ page import="java.sql.SQLException" %>


<%
request.setCharacterEncoding( "utf-8" );


String seq = request.getParameter( "seq" );
String password = request.getParameter( "password" );

String subject = request.getParameter( "subject" );
String mail = "";
if(!request.getParameter( "mail1" ).equals( "" ) && !request.getParameter( "mail2" ).equals( "" )) {
mail = request.getParameter( "mail1" ) + "@" + request.getParameter( "mail2" );
}

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

Connection conn = null;
PreparedStatement pstmt = null;

int flag = 2;
try {
Context initCtx = new InitialContext();
Context envCtx = (Context)initCtx.lookup( "java:comp/env" );
DataSource dataSource = (DataSource)envCtx.lookup( "jdbc/mariadb3" );

conn = dataSource.getConnection();

String sql = "update board1 set subject=?, mail=?, content=? where seq=? and password=?";
pstmt = conn.prepareStatement( sql );
pstmt.setString( 1, subject );
pstmt.setString( 2, mail );
pstmt.setString( 3, content );
pstmt.setString( 4, seq );
pstmt.setString( 5, password );

int result = pstmt.executeUpdate() ; //비밀번호 오류 확인
if( result == 0 ) {
flag = 1;
} else if( result == 1 ) {
flag = 0;
}
} catch( NamingException e ) {
System.out.println( "[에러] : " + e.getMessage() );
} catch( SQLException e ) {
System.out.println( "[에러] : " + e.getMessage() );
} finally {
if( pstmt != null ) pstmt.close();
if( conn != null ) conn.close();
}

out.println( "<script type='text/javascript'>" );
if(flag == 0) {
out.println( "alert('글수정 성공');" );
out.println( "location.href='board_view1.jsp?seq=" + seq + "';" );
} else if(flag == 1) {
out.println( "alert('비밀번호 오류');" );
out.println( "history.back();" );
} else {
out.println( "alert('글수정 에러');" );
out.println( "history.back();" );
}
out.println( "</script>" );
%>

 


게시판 로직 정리

* DB를 사용하는 파일은 DB사용 관련한 import문을 작성하도록 한다.

* select를 하면 DB의 내용을 각 행마다 불러오는 것이기 때문에 ResultSet을 사용해야 한다.

* Connection, PreparedStatement, ResultSet같은 내용은 finally에서 close를 선언 순서와 반대로 해주어야 한다.

* html에서 불러온 데이터를 적용하려면 적용할 곳(value혹은 데이터 필드)에 <%= %>형식으로 넣어주면 된다.

 

post사용법을 이용해 radiocheck를 하여 check하면 형태가 어떻게 변하길래 알아서 판단해주는거지?

 

 

 

getParameterValues;

 

 

-> 게시판 복습/정리 후 이모티콘 게시판 만들기


jsp 코드 작성할 때...

- 각 import는 맨 상단쪽에 몰아서 배치할 수 있도록 한다.

-  Java 코드는 중부에 몰아넣고 Javascript는 밑에 적도록 한다.

 

 

* DFD 정리하기

 

데이터 흐름도(DFD)

=> 프로세스나 시스템의 정보 흐름을 나타낸다.

     DFD는 직사각형, 원형이나 화살표와 같은 정의된 기호와 함께 짧은 텍스트 라벨을 사용하여

    데이터 입력, 출력, 저장 지점 및 각 도착지 사이의 경로를 표시한다.

 

  • 프로세스(Process): 원
  • 데이터 흐름도(Data Flow):  화살표
  • 자료 저장소(Data Store): 직선(단선/이중선)
  • 단말(Terminator):사각형

 

 

728x90
반응형