티스토리 뷰

오늘은 글 검색, 글 내용 보기.. 등등 을 할겁니다..

아래 그림은 기존의 글 검색 창이였습니다..



단지 글 제목만 찾는것이였는데요..

다시 만드는 게시판인데.. 기존의 게시판과는 차이를 두고 싶어서.. 한번 다르게 해봤습니다..

똑같이 만들면 뭐하로 다시 만들겠습니까..

업그레이드 게시판!.. 이기 때문에.. 이렇게 만들어 볼까 합니다..



앞의 선택의 따라서 검색 내용이 다르게 나오도록 할겁니다..

글 22개를 판다(panda), 판다(p)로만 등록해서;.. 우선 DB수정을 통해 아래와 같이 이름을 변경했습니다..


newboard_list 에 또 추가하겠습니다..

<html>
<head>
<title>3번 게시판</title>
</head>
<body>

<table width="100%" cellpadding="0" cellspacing="0" border="0">
<form name="searchForm" action="newboard_list.jsp" method="post">
<input type="hidden" name="pages" value="<%=pages%>">
 <tr>
  <td align="right">
   <select name="search_key">
    <option value="s_subject" <%=search_key.equals("s_subject") ? "selected" : ""%>>제목</option>
    <option value="s_name" <%=search_key.equals("s_name") ? "selected" : ""%>>이름</option>
   </select>
   <input type="text" name="search_value" size="20" maxlength="30" value="<%=search_value%>">
   <input type="image" src="이미지 주소" border="0" align="absmiddle" alt="검색">
  </td>
 </tr>
</form>
</table>


검색 폼을 만들어봤습니다.. 결과 이미지는 이렇습니다..



그럼 검색값이 입력되었을때 값을 넘겨줘야겠죠?..

 String view_link = "";

 String page_num = Page.nullToBlank(request.getParameter("page_num"));
 String pages =  Page.nullToBlank(request.getParameter("pages"));

 String search_key = Page.nullToBlank(request.getParameter("search_key"));
 String search_value = Page.nullToBlank(request.getParameter("search_value"));
 String s_subject = Page.nullToBlank(request.getParameter("s_subject"));
 String s_name = Page.nullToBlank(request.getParameter("s_name"));

 if (!pages.equals("")) link += "&pages="+pages;
 if (!page_num.equals("")) {
  link += "&page_num="+page_num;
  view_link += "&page_num="+page_num;
 }
 if (!search_key.equals("")) {
  link += "&search_key="+search_key;
  view_link += "&search_key="+search_key;
 }
 if (!search_value.equals("")) {
  link += "&search_value="+search_value;
  view_link += "&search_value="+search_value;
 }

을 추가해줬습니다.. nullToBlank 로 다 바꿔줬습니다.. 해줘서 나쁠건 없으니까요..

이미 전 시간에..  StringBuffer where = null; where = new StringBuffer(); query.append(where); 는 했으니..
별로 할것이 없네요..

<%
 try {
  stmt = conn.createStatement();
  query = new StringBuffer();
  where = new StringBuffer();

  String search_key_col = "";

  if (search_value.equals("") == false)
  {
   search_key_col = search_key.substring(2);

   if (search_key.equals("s_subject") == false &&
    search_key.equals("s_name") == false)
   {
    where.append(" AND "+search_key_col+" = '"+search_value+"' \n");
   }
   else
   {
    where.append(" AND "+search_key_col+" LIKE '%"+search_value+"%' \n");
   }
  }

  query.setLength(0);
  query.append("SELECT COUNT(SEQ) TOTAL FROM NEWBOARD \n")
    .append("WHERE SEQ IS NOT NULL \n");
  query.append(where);
  rs = stmt.executeQuery(query.toString());
  if (rs.next()) {
   totalCount = rs.getString("TOTAL");
  }
  rs.close();

  if (totalCount.equals("0")) {
%>

검색 결과입니다.. 검색창에 적힌 글이 포함된 글을 모두 찾기에 성공했습니다..



이제 글 내용 보기를 추가해봅시다.. 이게 게시판에서는 중요한 요소죠.. 글 내용을 볼 수 있어야 게시판이죠..
물론  번호 제목 내용 이름 등록일자 순으로 만들고 내용을 화면에 출력해도 되는데요..

내용이 너무 많으면.. 화면이 찌그러지니까 당연히 따로 view 페이지를 만든것입니다..

하지만!.. 꼭 view 페이지에서 봐야하나!.. 난 그렇게 보기 싫다!.. 다른 방법을 제시해달라는 분은 없었지만..

업그레이드 게시판이기 때문에.. 다른 방법으로 view 페이지를 만들어볼까 합니다..

보통 마우스는 화살표입니다.. 그리고 글 내용을 보기 위해 마우스 버튼을 올려놓으면 손으로 바뀌죠..
<style="cursor:hand"> 만 넣어준다면 쉽게 바꿀 수 있습니다..



이것 말고는 달리 표시할 방법이 생각나지 않았습니다..

그러다 다음 메인 화면을 보니까.. 마우스가 글 제목에 올라가면 색이 바뀌는것이 보이더군요..



그래 이걸 해보자!.. 란 생각이 들어서 이 방법을 해보기로 했습니다..

그런데 생각보다 어렵더군요;.. 거기에다 newboard_view 페이지를 만들 생각이 없기 때문에.. 더 힘드네요;..

newboard_list 에 또 추가를 해줍니다.. 글 내용을 newboard_list 에 바로 출력해줄겁니다..

<html>
<head>
<title>3번 게시판</title>
</head>
<body>

<script>
 function contentThreadView(obj, totalCount) {
  var obj = document.getElementById(obj);
  if ( obj.style.display == "none") {
   obj.style.display = "block";
  }
  else {
   obj.style.display = "none";
  }
  for (i=0; i<totalCount; i++){
   order = document.getElementById('contentsView'+i);
   if(document.getElementById('contentsView'+i)){
    if (order.style.display != "none" && order != obj) {
     order.style.display = "none";
    }
   }
  }
 }
</script>

<table width="100%" cellpadding="0" cellspacing="0" border="0">
<form name="searchForm" action="newboard_list.jsp" method="post">

   query.append("SELECT SEQ, NAME, SUBJECT, CONTENTS, REG_DATE, RNUM \n")
     .append("FROM ( \n")
     .append(" SELECT SEQ, NAME, SUBJECT, CONTENTS, REG_DATE, ROWNUM RNUM \n")
     .append(" FROM ( \n")
     .append("  SELECT SEQ, NAME, SUBJECT, CONTENTS, TO_CHAR(REG_DATE, 'YYYY-MM-DD') REG_DATE \n")
     .append("  FROM NEWBOARD \n")
     .append("  WHERE SEQ IS NOT NULL \n");
   query.append(where);
   query.append("  ORDER BY SEQ DESC \n")
     .append(" ) ) \n")
     .append("WHERE RNUM BETWEEN "+Page.pagingStatus(totalCount, page_no, page_num, "f_article")+" AND "+Page.pagingStatus(totalCount, page_no, page_num, "e_article")+" \n");
   rs = stmt.executeQuery(query.toString());

   if (page_num.equals("")) page_num = "1";
   int pageNo = Page.strToInt(page_num, 1);
   int tno = Page.strToInt(totalCount, 1);
   int no = (tno-(pageNo-1)*page_no);

   for (int i = 0; rs.next(); i++) {  // 이부분이 CLOB 불러오는 부분인데요..
    StringBuffer buf = new StringBuffer();
    Reader input = rs.getCharacterStream(4);   
// 여기서 4번째 저장된 값들을 가지고옵니다..
    char[] buffer = new char[1024];
    int byteReader;
    while((byteReader = input.read(buffer,0,1024))!=-1) {
     buf.append(buffer,0,byteReader);
    }
   contentsView = Page.b_html(buf.toString(),'A');  

     // b_html 은 <br> 이런게 글자로 저장되서 변환해주는겁니다..
%>

 <a onclick="contentThreadView('contentsView<%=i %>','<%=totalCount %>')">
 <tr height="25" align="center" style="cursor:hand">

  <td>&nbsp;</td>
  <td><%=no-- %></td>
  <td><%=rs.getString("SUBJECT") %></td>
  <td><%=rs.getString("NAME") %></td>
  <td><%=rs.getString("REG_DATE") %></td>
  <td>&nbsp;</td>
 </tr>

 <tr>
  <td colspan="5">
  <table width="100%" cellpadding="0" cellspacing="0" border="0">
   <tr align="center" id="contentsView<%=i %>" style="display:none;" >
    <td>&nbsp;</td>
    <td>내용</td>
    <td colspan="2"><table width="100%" cellpadding="0" cellspacing="0" border="1"><tr><td><%=contentsView %></td></tr></table></td>
    <td>[수정][삭제]</td>
    <td>&nbsp;</td>
   </tr>
  </table>
  </td>
 </tr></a>
 <tr height="1" bgcolor="#D2D2D2"><td colspan="6"></td></tr>

결과 화면입니다..  각 글 번호를 클릭하면.. 아래칸에 내용이 표시됩니다..



b_html로 내용을 출력했기 때문에.. 띄어쓰기도 제대로 나오구요..
내용을 보기 편하게 하려고 board="1" 값을 줬습니다..


b_html 를 쓰기 위해서 Page.java 에 b_html를 추가해줍니다..
 public static String b_html(String c,char tp) {
   String ret = c;
   switch ( tp ) {
    case 'A' :
      ret = StrReplace(ret,"\n","<br>");
      ret = StrReplace(ret,"  ","&nbsp;&nbsp;");
      ret = StrReplace(ret,"\t","&nbsp;&nbsp;&nbsp;");
      break;
    case 'H' :
      break;
    case 'T' :
      ret=StrReplace(ret, "<" , "&lt;");
      ret=StrReplace(ret, ">" , "&gt;");
      ret=StrReplace(ret,"\n","<br>");
      ret=StrReplace(ret,"  ","&nbsp;&nbsp;");
      ret=StrReplace(ret,"\t","&nbsp;&nbsp;&nbsp;");
      break;
    default  :
      break;
   }
   return ret;
 }

요걸 쓰기 위해서는 이게 또 필요해요;..
 public static String StrReplace(String sStr, String n1, String n2)
 {
   int iTmp = 0;
   if (sStr == null || sStr.equals("")) return "";

   String sTmp = sStr;
   StringBuffer sbSave = new StringBuffer();
   sbSave.append("");
   while (sTmp.indexOf(n1) > -1)
   {
    iTmp = sTmp.indexOf(n1);
    sbSave.append(sTmp.substring(0,iTmp));
    sbSave.append(n2);
    sTmp = sTmp.substring(iTmp + n1.length());
   }
   sbSave.append(sTmp);
   return sbSave.toString();
 }

오늘은 나름 바빠서.. 색 넣는걸 못했는데요.. (사실 색 넣다 실패했음;)..
빠른 기간내 색 넣기를 해보도록 하겠습니다..

글씨 색 넣는게 뭐가 어렵냐?.. 하시는 분들도 계실텐데요;..
이런식으로 마우스 올라가면 색이 변하고.. 클릭하면 <b> 로 글씨 굵게 변하고 그렇게 할겁니다..


자꾸 색 변경하는 곳에서 실패하네요..

아무튼 오늘의 소스입니다..



저작권 표시 꼭!.. 상업적 이용 절대 불가!.. 컨텐츠 변경 안됨!..