3. 레코드 리스트 출력 부분 작성 -4

미려김·2024년 3월 5일
jsp

JSP 프로그래밍

목록 보기
9/14

3.3 레코드 검색 기능

3.3.1 작성 목표와 내용

목표 : 키워드를 사용해 검색된 레코드만을 브라우저에 출력

  • 키워드를 사용한 검색 : 특정 단어나 문자열이 들어간 레코드만을 브라우저에 출력
  • 현재까지 작성된 BoardList.jsp 문서는 하나
    • 모든 레코드를 출력하는 BoardList.jsp 문서
    • 검색에 의한 일부 레코드만을 출력하는 BoardList.jsp 문서
    • 위 두 문서 별도 작성 X -> BoardList.jsp 문서가 2개의 질의를 가지면 됨(IF-ELSE)
    • 키워드의 존재 여부에 관계없이 [검색버튼] 클릭 -> BoardList.jsp 문서 자신이 재귀 호출됨
      • 아무런 값도 입력하지 않고 [검색버튼] 클릭할 경우 -> 키워드가 없는 것으로 간주

3.3.2 검색 기능 작성

클래스 파일 지정

  • 검색 기능 추가 -> java.net.URLEncoder 클래스 import
    • 사용 이유 : 키워드가 한글인 경우 encoder()메소드를 사용해 인코딩 하기 위해
  • 아래 구문 추가
<%@ page import=”java.net.URLEncoder”%>

한글 문자 인코딩

  • 검색 기능을 사용하기 위해, 기본 객체를 통해 전달되는 키워드가 한글인 경우 대비
  • setCharacterEncoding()메소드를 사용 -> 인코딩할 문자 집합 UTF-8로 지정
<%request.setCharacterEncoding(”UTF-8”);%>

변수의 추가 선언

  • 검색 기능 구현(IF-ELSE 구문 내 아래 2개의 질의 함께 표현)
    • 모든 레코드를 검색하는 질의
    • 키워드를 사용해 일부 레코드를 검색하는 질의
  • 질의를 생성할 변수 선언해야함
String Query1=""; 
// 레코드의 수를 출력하기 위한 질의내용
// 검색 기능 사용 X : 전체 레코드의 수 추출
// 검색 기능 사용 : 검색 키워드가 포함된 레코드의 수만을 추출
String Query2="";
//  문서에 출력할 레코드의 필드를 추출하는 질의 내용
// 검색 기능 사용 X : 전체 레코드의 필드 추출
// 검색 기능 사용 : 검색 키워드가 포함된 레코드에 대해서만 필드 추출
String encoded_key="";
// 메소드를 사용해 한글 키워드를 인코딩하여 저장하기 위해 선언된 변수
// 사실 이 메소드는 현재 BoardList.jsp 문서에서 검색 기능을 사용해 레코드를 출력할 땐 사용 X
// 다음 절에서 작성할 BoardContent.sjp 문서로 키워드 전달하기 위해 사용

키워드 추출

  • 키워드 : 검색 기능을 사용하기 위해 [키워드 입력 상자]에 입력된 문자열
    • FORM 태그에 의해 POST 방식으로 BoardList.jsp 문서 자신에게 전달
    • 키워드 종류 (한글 / 영문 / 숫자)
      • 한글의 경우
        • setCharacterEncoding 메소드 사용 -> BoardList.jsp 문서 내에서의 사용은 문제 X
        • 문제 : 다른 문서로의 전달
          • 한 문서에서 다른 문서로 데이터를 전달할 때 FORM의 구성 요소에 입력된 데이터를 제외한 모든 데이터는 GET 방식 사용
          • GET 방식 : URL 다음에 변수와 값의 쌍 형태로 전달
          • 전달되는 값이 한글인 경우에는 반드시 인코딩 후 전달
          • 한글 데이터는 인코딩 후 전달 -> 데이터 전달 받는 문서는 디코딩 안해도 됨
          • 인코딩 된 데이터가 URL을 통해 전달되면 수신측에서 자동으로 디코딩됨
String column = request.getParameter("column");
if (column == null) column=""; // column 값이 null 이라면 키워드 검색 사용 X -> 검색 대상이 없는 것으로 간주 => column에 빈 문자열 지정

String key = request.getParameter("key");
if(key != null){ //key 값 존재 
	encoded_key = URLEncoder.encode(key, "UTF-8"); // encoder()메소드 사용 -> 인코딩 후 encoded_key에 저장, 인코딩은 한글에만 적용됨
} else{
	key=""; // key값이 null이면 키워드 검색 사용 X -> key에 빈 문자열 저장
}

SQL 질의 수정

  • 전체 레코드 추출을 위한 질의
String Query1 = "SELECT count(RcdNO) FROM dbo.board";
String Query2 = "SELECT RcdNo, UsrSubject, Usrname, UsrDate, UsrRefer FROM dbo.board ORDER BY RcdNo DESC";
  • 키워드 검색을 수행하기 위해 아래와 같이 수정
if (column.equals("") || key.equals("")){ // 검색 기능을 사용하지 않는 경우 수행되는 질의, 하나라도 존재 하지 않을 경우, 검색기능 정상 수행 X
		Query1 = "SELECT count(RcdNO) FROM dbo.board";
		Query2 = "SELECT RcdNo, UsrSubject, Usrname, UsrDate, UsrRefer FROM dbo.board ORDER BY RcdNo DESC";
	} else{ // 검색 기능을 사용하는 경우 수행되는 질의 -> 키워드 검색을 위한 LIKE 구문 포함
		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";
	} // * 그냥 key를 사용해야함! 인코딩된 키 X
		// encoded_key는 오로지 GET 방식으로 다른 문서에 전달할 때만 사용

검색 버튼 재지정

  • 검색 버튼 클릭 -> 현재 FORM 요소에 입력된 검색 대상(제목/내용)과 키워드를 BoardList.jsp 자신으로 전달해야함
  • [검색] 버튼 이미지에 submit()메소드 추가해야 함
  • 기존 내용
<IMG SRC="../images/btn_search.gif" ALIGN=absmiddle STYLE=CURSOR:HAND>
  • 변경
<IMG SRC="../images/btn_search.gif" ALIGN=absmiddle STYLE=CURSOR:HAND onClick="javascripts:submit()">

전체코드

<%@ 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" %> // java.net.URLEncoder 클래스 import

<%request.setCharacterEncoding("UTF-8");%>
// 전달되는 키워드 한글인 경우 대비, 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="";

//---------------------- 키워드 데이터 추출
// 전달되는 검색 대상 column과 키워드 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="BoardList_v3_keywordSearch.jsp"><%=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_v3_keywordSearch.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')" 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()">
				// 검색 버튼 클릭했을 때 검색 대상과 키워드가 BoardList.jsp 문서로 전달되도록 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>
profile
미려김
안녕하세요.
이전 포스트

3. 레코드 리스트 출력 부분 작성 -3

다음 포스트

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

0개의 댓글