4. 레코드 상세 내용 출력 부분 작성 -4

미려김·2024년 3월 8일
jsp

JSP 프로그래밍

목록 보기
13/14

현재까지 수정된 내용

BoardList.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ page import="java.text.SimpleDateFormat" %>
<%@ page import="java.sql.*" %>
<%@ page import="java.net.URLEncoder" %>

<%request.setCharacterEncoding("UTF-8");%>



<%
//------------------- 변수 및 객체 선언
Connection conn = null;
PreparedStatement pstmt = null;
ResultSet rs1 = null;
ResultSet rs2 = null;

int TotalRecords = 0;

String Query1="";
String Query2="";
String encoded_key="";

//---------------------- 키워드 데이터 추출
String column = request.getParameter("column");
if (column == null) column="";

String key = request.getParameter("key");
if(key != null){
	encoded_key = URLEncoder.encode(key, "UTF-8");
} else{
	key="";
}

try{
	//---------------- JDBC 설정
	String jdbcUrl = "jdbc:sqlserver://(localhost):(port);encrypt=false;DatabaseName=(name);";
	String jdbcId = "id";
	String jdbcPw = "pw";
	
	Class.forName("com.microsoft.sqlserver.jdbc.SQLServerDriver");
	conn = DriverManager.getConnection(jdbcUrl, jdbcId, jdbcPw);
	
	//-------------------- 질의의 생성과 객체의 생성
	if (column.equals("") || key.equals("")){
		Query1 = "SELECT count(RcdNO) FROM dbo.board";
		Query2 = "SELECT RcdNo, UsrSubject, Usrname, UsrDate, UsrRefer FROM dbo.board ORDER BY RcdNo DESC";
	} else{
		Query1 = "SELECT count(RcdNO) FROM dbo.board WHERE "+column+" LIKE '%"+key+"%'";
		Query2 = "SELECT RcdNo, UsrSubject, Usrname, UsrDate, UsrRefer FROM dbo.board WHERE "+column+" LIKE '%"+key+"%'" + " ORDER BY RcdNo DESC";
	}
	
	pstmt = conn.prepareStatement(Query1);
	rs1 = pstmt.executeQuery();
	pstmt = conn.prepareStatement(Query2);
	rs2 = pstmt.executeQuery();
	
	//------------------------ 전체 레코드 수 추출
	rs1.next();
	TotalRecords = rs1.getInt(1);
%>

<!DOCTYPE html>
<html>
<head>
	<meta HTTP-EQUIV="CONTENT-TYPE" CONTENT="TEXT/HTML"; charset="UTF-8">
	<LINK REL="stylesheet" type="text/css" herf="../include/style.css"/>
	<title>게시글 리스트</title>
</head>

<body>

	<TABLE WIDTH=620 HEIGHT=40 BORDER=0 CELLSPACING=1 CELLPADDING=1 ALIGN=CENTER>
		<TR BGCOLOR=#A0A0A0>
			<TD ALIGN=CENTER><FONT SIZe=4><B>게시판(리스트)</B></FONT></TD>
		</TR>
	</TABLE>

<%
//--------------------- JSP CODE START (세션 속성에 따른 문서 선택)
	String member_id = (String)session.getAttribute("member_id");
			if(member_id == null) {
%>			
	<jsp:include page="../member/LoginForm.jsp"/>
<%
			} else {
%>
	<jsp:include page="../member/LoginState.jsp"/>

<%
			}
//--------------------- JSP CODE END
%>
			
	<TABLE WIDTH=620 BORDER=1 CELLSPACING=0 CELLPADDING=1 ALIGN=CENTER>
		<TR ALIGN=CENTER>
			<TD WIDTH=45><B>번호</B></TD>
			<TD WIDTH=395><B>제목</B></TD>
			<TD WIDTH=65><B>작성자</B></TD>
			<TD WIDTH=70><B>작성일</B></TD>
			<TD WIDTH=45><B>참조</B></TD>
		</TR>
		
		<%
		//----------------------------- 순환문을 이용한 레코드 출력 시작
		while(rs2.next()){
			//---------------------------------- 필드 데이터 추출과 출력
			int rno = rs2.getInt("RcdNo");
			String subject = rs2.getString("UsrSubject");
			String name = rs2.getString("UsrName");
			
			long date = rs2.getLong("UsrDate");
			SimpleDateFormat Current = new SimpleDateFormat("yyyy/MM/dd");
			String today = Current.format(date);
			
			int refer = rs2.getInt("UsrRefer");
			%>		

			<TR>
				<TD WIDTH=45 ALIGN=CENTER><%=TotalRecords%></TD>
				<TD WIDTH=395 ALIGN=LEFT><A HREF="BoardContent.jsp?rno=<%=rno%>&column=<%=column%>&key=<%=encoded_key%>"><%=subject%></A></TD>
				<TD WIDTH=65 ALIGN=CENTER><%=name%></TD>
				<TD ALIGN=CENTER><%=today%></TD>
				<TD ALIGN=CENTER><%=refer%></TD>
			</TR>
		
			<%
				//------------------------- 순환문을 이용한 레코드 출력 종료
				TotalRecords--;
			} //---end of while		 
			%>
		
		
	</TABLE>
	
	<FORM NAME="BoardSerch" METHOD=POST action="BoardList.jsp">
	
	<TABLE WIDTH=620 HEIGHT=50 BORDER=0 CELLSPACING=1 CELLPADDING=1 ALIGN=CENTER>
	
		<TR>
			<TD ALIGN=LEFT WIDTH=100>
				<IMG SRC="../images/btn_new.gif" onClick="javascript:location.replace('BoardWrite.jsp?column=<%=column%>&key=<%=encoded_key%>')"; STYLE=CURSOR:HAND>
			</TD>
			<TD WIDTH=320 ALIGN=CENTER>
				<IMG SRC="../images/btn_bf_block.gif">&nbsp;
				<IMG SRC="../images/btn_bf_page.gif">&nbsp;
				1&nbsp;&nbsp;2&nbsp;&nbsp;3&nbsp;&nbsp;4&nbsp;&nbsp;5&nbsp;&nbsp;6&nbsp;&nbsp;7&nbsp;&nbsp;8&nbsp;&nbsp;9&nbsp;&nbsp;10&nbsp;
				
				<IMG SRC="../images/btn_nxt_page.gif">&nbsp;
				<IMG SRC="../images/btn_nxt_block.gif">
			</TD>
			
			<TD WIDTH=200 ALIGN=RIGHT>
				<SELECT NAME="column" SIZE=1>
					<OPTION VALUE="" SELECTED>선택</OPTION>
					<OPTION VALUE="UsrSubject">제목</OPTION>
					<OPTION VALUE="UsrContent">내용</OPTION>
				</SELECT>
				<INPUT TYPE=TEXT NAME="key" SIZE=10 MAXLENGTH=20>
				<IMG SRC="../images/btn_search.gif" ALIGN=absmiddle STYLE=CURSOR:HAND onClick="javascripts:submit()">
			</TD>
		</TR>
	</TABLE>
	</FORM>
<%
} catch (SQLException e) {
	e.printStackTrace();
} finally {
	
	// close() 호출 전에 conn이 null이 아닌지 확인
    if (conn != null) {
		//---------------------- 생성된 객체의 제거와 페이지 이동
		rs1.close();
		rs2.close();
		pstmt.close();
		conn.close();
    }
}

%>

	
</body>
</html>

BoardWrite.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ page import="java.net.URLEncoder"%>

<%
String encoded_key = "";

//------------------------------- 키워드 데이터 추출
String column = request.getParameter("column");
if (column == null) column="";

String key = request.getParameter("key");
if (key!=null) {
	encoded_key = URLEncoder.encode(key, "UTF-8");
} else{
	key="";
}
%>

<!DOCTYPE html>
<html>
<head>
	<meta HTTP-EQUIV="CONTENT-TYPE" CONTENT="TEXT/HTML; CHARSET=UTF-8"/>
	<LINK REL="stylesheet" type="text/css" herf="../include/style.css"/>
	<SCRIPT language="javascript" SRC="../include/scripts.js"></SCRIPT>
	<title>게시글 입력</title>
	
	<SCRIPT type="text/javascript">
	
		function CheckForm(form){
			
			if(!form.name.value){
				alert('성명을 입력하세요.');
				form.name.focus();
				return true;
			}
			
			if(form.mail.value){
				if( !isCorrectEmail('BoardWrite', 'mail')){
					alert('전자우편형식이 올바르지 않습니다.');
					form.mail.focus();
					form.mail.select();
					return;
				}
			}
			
			if(!form.subject.value){
				alert('게시판의 제목을 입력하세요.');
				form.subject.focus();
				return true;
			}
			
			if(!form.pass.value){
				alert('패스워드를 입력하세요.');
				form.pass.focus();
				return true;
			}
			form.submit();
		}
	
	</SCRIPT>
	
</head>

<body>
		
	<TABLE WIDTH=620 HEIGHT=40 BORDER=0 CELLSPACING=1 CELLPADDING=1 ALIGN=CENTER>
		<TR BGCOLOR=#A0A0A0>
			<TD ALIGN=CENTER><FONT SIZe=4><B>게시판(게시글 입력)</B></FONT></TD>
		</TR>
	</TABLE>
		
	<%
 	/* JSP CODE START (세션 속성에 따른 문서 선택)  */
 	String member_id = (String)session.getAttribute("member_id");
			if (member_id == null){
	%>			
			<jsp:include page="../member/LoginForm.jsp"/>
	<% 
			} else {
	%>
			<jsp:include page="../member/LoginState.jsp"/>
	<% 
	}
	/* JSP CODE END  */		
	%>

	<FORM NAME="BoardWrite" METHOD=POST ACTION="BoardWriteProc.jsp">

	<TABLE WIDTH=620 BORDER=1 CELLSPACING=0 CELLPADDING=2 ALIGN=CENTER>
		<TR>
			<TD WIDTH=120 ALIGN=CENTER><B>이름</B></TD>
			<TD WIDTH=500>
				<INPUT TYPE=TEXT NAME="name" SIZE=20 style="ime-mode:inactive" onKeyDown='javascript:Korean()'>
			</TD>
		</TR>
		
		<TR>
			<TD WIDTH=120 ALIGN=CENTER><B>전자우편</B></TD>
			<TD WIDTH=500>
				<INPUT TYPE=TEXT NAME="mail" SIZE=60 style="ime-mode:inactive">
			</TD>
		</TR>
		
		<TR>
			<TD WIDTH=120 ALIGN=CENTER><B>제목</B></TD>
			<TD WIDTH=500>
				<INPUT TYPE=TEXT NAME="subject" SIZE=70>
			</TD>
		</TR>
		
		<TR>
			<TD WIDTH=120 ALIGN=CENTER><B>내용</B></TD>
			<TD WIDTH=500>
				<TEXTAREA NAME="content" COLS=70 ROWS=8></TEXTAREA>
			</TD>
		</TR>
		
		<TR>
			<TD WIDTH=120 ALIGN=CENTER><B>파일첨부</B></TD>
			<TD WIDTH=500>
				<INPUT TYPE=FILE NAME="filename" SIZE=60>
			</TD>
		</TR>
		
		<TR>
			<TD WIDTH=120 ALIGN=CENTER><B>패스워드</B></TD>
			<TD WIDTH=500>
				<INPUT TYPE=PASSWORD NAME="pass" SIZE=20>
			</TD>
		</TR>
		
	</TABLE>
	</FORM>
	
	<TABLE WIDTH=620 HEIGHT=50 BORDER=0 CELLSPACING=1 CELLPADDING=1 ALIGN=CENTER>
		<TR ALIGN=CENTER>
			<TD WIDTH=110 ALIGN=LEFT>
				<IMG SRC="../images/btn_list.gif" onClick="javascript:location.replace('BoardList.jsp?column=<%=column%>&key=<%=encoded_key%>')" STYLE=CURSOR:HAND>
			</TD>
			<TD WIDTH=400 ALIGN=CENTER>
				<IMG SRC="../images/btn_save.gif" STYLE=CURSOR:HAND onClick="javascript:CheckForm(BoardWrite)">&nbsp;&nbsp;
				<IMG SRC="../images/btn_cancle.gif" onClick="javascript:location.replace('BoardList.jsp?column=<%=column%>&key=<%=encoded_key%>')" STYLE=CURSOR:HAND>
			</TD>
			<TD WIDTH=110 ALIGN=LEFT>&nbsp;</TD>
		</TR>
	</TABLE>
</body>
</html>

BoardContent.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ page import="java.sql.*" %> 
<%@ page import="java.net.URLEncoder" %>
// JDBC와 encode() 메소드를 사용하기 위한 클래스들을 import 하는 구문

<%
int rno = Integer.parseInt(request.getParameter("rno"));
// request 기본 객체를 통해 전달된 레코드 식별자 rno 추출하는 구문

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

String encoded_key="";
// JDBC를 사용하기 위한 객체와 키워드 인코딩을 위한 변수 선언

//--------------------------- 전송된 검색어 처리
String column = request.getParameter("column");
if (column == null) column="";

String key = request.getParameter("key");
if (key!=null){
	encoded_key = URLEncoder.encode(key, "UTF-8");
	} else {
		key="";
	}
	// 검색 기능을 사용할 경우 전달된 column, key 추출
	// 키워드가 존재할 경우 키워드를 인코딩하는 구문

try{
	//------------------------ JDBC 설정
	String jdbcUrl = "jdbc:sqlserver://(localhost):(port);encrypt=false;DatabaseName=(name);";
	String jdbcId = "id";
	String jdbcPw = "pw";
	
	Class.forName("com.microsoft.sqlserver.jdbc.SQLServerDriver");
	conn = DriverManager.getConnection(jdbcUrl, jdbcId, jdbcPw);
	// JDBC를 사용하기 위한 Connection 객체 생성

	//---------------------------- UsrRefer 필드값 1 증가
	String Query1 = "UPDATE dbo.board SET UsrRefer=UsrRefer+1 WHERE RcdNo=?";
	pstmt = conn.prepareStatement(Query1);
	
	pstmt.setInt(1, rno);
	pstmt.executeUpdate();
	// UsrRefer 필드 값을 1만큼 증가시키고 질의 생성하고 수행	

	String Query2 = "SELECT UsrName, UsrMail, UsrSubject, UsrContent FROM dbo.board WHERE RcdNo=?";
	pstmt = conn.prepareStatement(Query2);
	pstmt.setInt(1, rno);
	rs1 = pstmt.executeQuery();
	rs1.next();
	// BoardContent.jsp 문서에 출력할 레코드를 추출하는 질의 수행, 레코드의 각 필드 값들 추출하는 구문

	String name = rs1.getString(1);
	String mail = rs1.getString(2);
	String subject = rs1.getString(3).trim();
	String content = rs1.getString(4).trim();
	content = content.replaceAll("\r\n","<BR>");
	
%>

<!DOCTYPE html>
<html>
<head>
	<meta HTTP-EQUIV="CONTENT-TYPE" CONTENT="TEXT/HTML; charset="UTF-8"/>
	<LINK REL="stylesheet" type="text/css" herf="../include/style.css">
	<title>게시글 출력</title>
</head>

<body>

	<TABLE WIDTH=620 HEIGHT=40 BORDER=0 CELLSPACING=1 CELLPADDING=1 ALIGN="CENTER">
		<TR BGCOLOR=#A0A0A0>
			<TD ALIGN=CENTER><FONT SIZE=4><B>게시판(게시글 출력)</B></FONT></TD>
		</TR>
	</TABLE>

<%
//---------------JSP CODE START(세션 속성에 따른 문서 선택)
	String member_id =(String)session.getAttribute("member_id");
	if (member_id ==null){
%>
	<jsp:include page="../member/LoginForm.jsp"/>
<% 	
	} else{
%>
	<jsp:include page="../member/LoginState.jsp"/>
<%
	}
//--------------------- JSP CODE END
%>

	<TABLE WIDTH=620 BORDER=1 CELLSPACING=1 CELLPADDING=1 ALIGN="CENTER">
		<TR>
			<TD WIDTH=120 ALLIGN=CENTER><B>이름</B></TD>
			<TD WIDTH=500><%=name%></TD>
		</TR>
		
		<TR>
			<TD WIDTH=120 ALLIGN=CENTER><B>전자우편</B></TD>
			<TD WIDTH=500><%=mail%></TD>
		</TR>
		
		<TR>
			<TD WIDTH=120 ALLIGN=CENTER><B>제목</B></TD>
			<TD WIDTH=500><%=subject%></TD>
		</TR>
		
		<TR>
			<TD WIDTH=120 ALLIGN=CENTER><B>내용</B></TD>
			<TD WIDTH=500><%=content%></TD>
		</TR>
		// 추출한 이름, email주소, 레코드의 제목, 레코드의 내용이 브라우저 출력되게 함

		<TR>
			<TD WIDTH=120 ALLIGN=CENTER><B>첨부파일</B></TD>
			<TD WIDTH=500>첨부된 파일이 없습니다. </TD>
		</TR>
	</TABLE>
	
	<TABLE WIDTH=620 HEIGHT=50 BORDER=0 CELLSPACING=1 CELLPADDING=1 ALIGN="CENTER">
		<TR ALIGN="CENTER">
			<TD WIDTH="310" ALIGN=LEFT>
				<IMG SRC="../images/btn_list.gif" STYLE=CURSOR:HAND onClick="javascript:location.replace('BoardList.jsp?column=<%=column%>&key=<%=encoded_key%>')">
			</TD>
			
			<TD WIDTH="310" ALIGN=RIGHT>
				<IMG SRC="../images/btn_reply.gif" STYLE=CURSOR:HAND onClick="javascript:location.replace('BoardReply.jsp?rno=<%=rno%>&column=<%=column%>&key=<%=encoded_key%>')">&nbsp;&nbsp;
				<IMG SRC="../images/btn_mdfy.gif" STYLE=CURSOR:HAND onClick="javascript:location.replace('BoardModify.jsp?rno=<%=rno%>&column=<%=column%>&key=<%=encoded_key%>')">&nbsp;&nbsp;
				<IMG SRC="../images/btn_del.gif" STYLE=CURSOR:HAND onClick="javascript:location.replace('BoardDelte.jsp?rno=<%=rno%>&column=<%=column%>&key=<%=encoded_key%>')">
				// BoardContent.jsp 문서가 포함하고 있는 목록, 작성, 수정, 삭제 문서로의 하이퍼링크 변수에 rno, column, key 추가 -> 기존 하이퍼 링크 변경
			</TD>
		</TR>
	</TABLE>

<%
} // ---- end of try
catch (SQLException e){
	e.printStackTrace();
} finally{
    if (conn != null) {
		//---------------------- 생성된 객체의 제거와 페이지 이동
		rs1.close();
		pstmt.close();
		conn.close();
    }
}
%>
</body>
</html>
  • 겪었던 오류 아닌 오류
int rno = Integer.parseInt(request.getParameter('rno'));

  • 이해 안가는 점 (이름때문에 사진 크롭)

    • BoardList.jsp로 들어감 → 제목 클릭 → 잘 보임

    • BoardWrite.jsp로 들어감 → 목록 클릭→ 제목 클릭 ⇒ 잘 보임


    • BoardContent.jsp 실행 → 에러발생 Why..?!

    • 아니 근데 BoardContent.jsp의 기능인 참조 카운트도 잘 됨

    • 왜 BoardContent.jsp을 실행시키면 rno에서 에러가 날까?

      • 생각해보니 당연한 것 같음
      • BoardContent.jsp는 BoardList.jsp에서 출발해서 상세 내용을 보기 위해 작성된 코드로 BoardList.jsp에서 rno를 받아 해당 rno의 문서를 보여주는 것이 목적인 코드
      • 따라서 BoardList에서 BoardContent는 잘 실행되지만 BoardContent 단독으로는 실행 안됨
      • 당연함~! 받아 온 rno에 해당하는 문서를 보여주는 코드임!
      • BoardContent 입장에선 rno도 안주면서 뭘 띄우라느거임?!ㅇㅇ
      • 그럼 이 코드도 문제 없이 수행되는 걸로 결론 땅땅땅
profile
미려김
안녕하세요.
이전 포스트

4. 레코드 상세 내용 출력 부분 작성 -3

다음 포스트

5. 레코드의 수정 부분 작성 -2

0개의 댓글