3. 게시판 그룹 읽기 / 삭제

사용자가 트리의 노드를 선택하면

onActivate 이벤트에 지정된 TreenodeActivate함수가 실행된다.

파라메터로 사용자가 선택한 노드(node)가 넘어오고

전역변수(selectedNode)에 넣어서 다른 함수에서 사용할 수 있게 했다.

selectedNode(node).data.key는 TreeVO 구성시 key를 의미하고

그룹번호(bgno)가 저장되어 있다.

이 값(key== bgno)을 파라메터로

게시판 그룹 정보 읽기 컨트롤(boardGroupRead)을 호출한다.

콜백 함수는 receiveData로 반환에 성공하면

지정된 그룹번호(bgno)에 해당하는 데이터가 JSON 형태로 반환된다(receiveData).

Function TreenodeActivate(node) {     selectedNode = node;         if (selectedNode==null || selectedNode.data.key==0) return;     $.ajax({         url: "boardGroupRead",         cache: false,         data: { bgno : selectedNode.data.key }            }).done(receiveData); } function receiveData(data){     $("#bgno").val(data.bgno);     $("#bgname").val(data.bgname);     $('input:radio[name="bgused"][value="' + data.bgused + '"]').prop('checked', true);     $('input:radio[name="bgreadonly"][value="' + data.bgreadonly + '"]').prop('checked', true);     $('input:radio[name="bgreply"][value="' + data.bgreply + '"]').prop('checked', true); }

BoardGroupList.jsp

수신된 데이터(receiveData)는 JQuery 적당하게 값을 설정하면 된다.

코드가 복잡하게 보이는 것은

Radio를 ID가 아닌 Name으로 접근해서 그렇다.

게시판 사용여부(BGUSED), 댓글 기능 사용여부(BGREPLY), 글쓰기 금지(BGREADONLY) 는 Y/N로 저장되고

Radio의 선택여부에 따라서 Y/N으로 설정하면 된다.

사용된 HTML 코드를 보면

사용여부의 경우 name은 bgused이고 ID는 bgusedY와 bgusedN인 두 개의 radio가 있다.

각각은 Label이 사용/사용중지로 되어 있으며

Label의 for 속성이 bgusedY와 bgusedN를 가리킨다.

이것은 작은 radio를 선택할 수도 있고

글자를 표현한 Label를 선택해도 해당(for) radio를 선택하게 하기 위한 것이다.

따라서 radio의 ID가 달라야 한다.

댓글 기능 사용여부(BGREPLY), 글쓰기 금지(BGREADONLY)도 동일한 방식으로 구현하였다.

<tr>     <th>사용여부</th>     <td>         <input name="bgused" id="bgusedY" type="radio" checked="checked" value="Y"><label for="bgusedY">사용</label>         <input name="bgused" id="bgusedN" type="radio" value="N"><label for="bgusedN">사용중지</label>     </td> </tr> <tr>     <th>등록가능</th>     <td>         <input name="bgreadonly" id="bgreadonlyN" type="radio" checked="checked" value="N"><label for="bgreadonlyN">사용</label>         <input name="bgreadonly" id="bgreadonlyY" type="radio" value="Y"><label for="bgreadonlyY">사용안함</label>     </td> </tr> <tr>     <th>댓글</th>     <td>         <input name="bgreply" id="bgreplyY" type="radio" checked="checked" value="Y"><label for="bgreplyY">사용</label>         <input name="bgreply" id="bgreplyN" type="radio" value="N"><label for="bgreplyN">사용안함</label>     </td> </tr>

BoardGroupList.jsp

JQuery는 ID를 이용하여 쉽게 사용할 수 있는데 ($(“bgused"]))

이상의 내용 때문에 다음과 같이 Name을 사용해야 한다.

$('input:radio[name="bgused"])

receiveData에서 다소 복잡해 보이는 다음의 코드는

이름(name)이 그룹번호(bgused)인 태그 중에서

값(value)이 Y/N인 태그의 체크(checked) 속성(prop)을 true로 설정하여

선택된 모습으로 출력해 주는 것이다.

    $('input:radio[name="bgused"][value="' + data.bgused + '"]').prop('checked', true);
    $('input:radio[name="bgreadonly"][value="' + data.bgreadonly + '"]').prop('checked', true);
    $('input:radio[name="bgreply"][value="' + data.bgreply + '"]').prop('checked', true);

JQuery가 복잡해 보일 뿐

컨트롤과 서비스, SQL문은 게시판과 동일하다.

컨트롤에서 BoardGroupVO로 받아온 그룹 정보(bgInfo)를

ObjectMapper를 이용하여 JSON으로 변환하여 전송하는 것이 다르다.

@RequestMapping(value = "/boardGroupRead")        public void boardRead(HttpServletRequest request, HttpServletResponse response){                 String bgno = request.getParameter("bgno");                 BoardGroupVO bgInfo = boardSvc.selectBoardGroupOne(bgno);                 ObjectMapper mapper = new ObjectMapper();         response.setContentType("application/json;charset=UTF-8");                 try {             response.getWriter().print( mapper.writeValueAsString(bgInfo));         } catch (IOException ex) {              System.out.println("오류: 게시판 그룹에 문제가 발생했습니다.");         }     }

BoardGroupCtr.java

public BoardGroupVO selectBoardGroupOne(String param){         return sqlSession.selectOne("selectBoardGroupOne", param); }

BoardGroupSvc.java

<select id="selectBoardGroupOne" parameterType="String" resultType="gu.board9.BoardGroupVO">         SELECT BGNO, BGNAME, BGUSED, BGREPLY, BGREADONLY           FROM TBL_BOARDGROUP          WHERE BGDELETEFLAG='N' AND BGNO=#{bgno}  </select>

board9.xml

삭제(fn_groupDelete)는 지정된 트리 노드의 값(key, bgno)을

Ajax로 서버로 보내(boardGroupDelete)서 삭제하고

적절한 메시지를 출력해 주면 된다.

그리고, 트리에서 현재 선택된 노드를 제거하고(remove)

선택되면서 출력된 값들을 지워준다.

유사한 코드로 구성되어 상세한 설명을 생략한다.