7월 16일
1.게시물 수정 과 삭제
(1)modify.jsp 중 html 작성 부분
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<%@include file="../includes/header.jsp"%>
<div class="row">
<div class="col-lg-12">
<h1 class="page-header">Board Modify/delete</h1>
</div>
<!-- /.col-lg-12 -->
</div>
<!-- /.row -->
<div class="row">
<div class="col-lg-12">
<div class="panel panel-default">
<div class="panel-heading">
Board RedePage
</div>
<!-- /.panel-heading -->
<form>
<div class="panel-body">
<div class="form-group" >
<label>bno</label>
<input class="form-control" name="bno" readonly="readonly" value='<c:out value="${board.bno}"/>'>
</div>
<div class="form-group" >
<label>title</label>
<input class="form-control" name="title" value='<c:out value="${board.title}"/>'>
</div>
<div class="form-group">
<label>content</label>
<textarea rows="5" cols="50" name="content" class="form-control"><c:out value="${board.content}"/></textarea>
</div>
<div class="form-group">
<label>writer</label>
<input class="form-control" name="writer" readonly="readonly" value='<c:out value="${board.writer}"/>'>
</div>
<button class="btn btn-default" data-oper='modify'>Modify</button>
<button class="btn btn-danger" data-oper='remove'>Remove</button>
<button class="btn btn-info" data-oper='list'>list</button>
</div>
</form>
<!-- /.panel-body -->
</div>
<!-- /.panel -->
</div>
<!-- /.col-lg-12 -->
</div>
<!-- /.row -->
<%@include file="../includes/footer.jsp"%> 보통은 form action으로 넘겨주는걸 구현해주는데,
보면 그부분을 script로 처리함.
버튼 부분 보면 submit태그는 빼버리고,button태그로 처리하고 이동은 아래 스크립트에서 처리
(2)modify.jsp 중 script부분
<script>
$(document).ready(function() {
var formObj=$("form"); //form태그 정의
$('.btn').click(function(e){ //버튼을 클릭시 하위 이벤트가 일어남
e.preventDefault(); // html 에서 a 태그나 submit 태그는 고유의 동작이 있다.
//페이지를 이동시킨다거나 form 안에 있는 input 등을 전송한다던가 그러한 동작이 있는데
//e.preventDefault 는 그 동작을 중단시킨다.
var operation=$(this).data("oper"); //위에 html 버튼 부분에 'data-oper' 로 속성을 지정해준게 있는데, 변수로 담아줌
//html에서 데이터를 저장하는 방법으로 보통은 'data-속성명'을 지정해줘서 스크립트에서 처리함.
//예전에는 input[type='hidden'] 를 사용하여 데이터를 넘겨주기도함.
console.log(operation);
if(operation==='list'){//'data-oper' 가 담아온 데이터가 list면..
self.location="/board/list"; //지정경로로 이동해죠
}else if(operation==='remove'){ /'data-oper' 가 담아온 데이터가 remove면..
formObj.attr("action","/board/remove") //위에 html form변수에 속성 담아서 action 속성 과 value 담아서 보내줌
.attr("method","post"); //속성과 value 담아서 보내줌
formObj.submit(); //form속성과 value를 보냄
}else if(operation==='modify'){ //위와 같은데 이동경로만 다름
formObj.attr("action","/board/modify")
.attr("method","post");
formObj.submit();
}
})
});
</script> (3)get.jsp 버튼수정
조회화면에서 목록 화면으로 가던지, 수정하면으로 갈때 이동하는 부분을 수정
html에 있는 버튼 부분
a태그로 이동,
수정버튼은 페이지 이동시 bno를 가지고 이동해야 하므로 ?bno=${board.bno} 이부분 넣어줌
<button class="btn btn-default"><a href="/board/list">목록</a></button>
<button class="btn btn-default"><a href="/board/modify?bno=${board.bno}">수정하기</a></button>(4)수정완료시 뜨는 모달창 수정
checkModal의 result매개변수로 받는데, boardController의 modify 메서드를 처리후 성공하면 rttr.addFlashAttribute("result","success") 담아 메세지를 보냄.
<script>
$(document).ready(function() {
var result='<c:out value="${result}"/>';
checkModal(result);
history.replaceState({},null,null);
function checkModal(result) {
if(result===''||history.state){
return;
}
if(result==='success'){ //rttr.addFlashAttribute("result","success") 보낸 메세지가 success이면
$(".modal-body").html(
"정상적으로 처리되었슴둥!!!");
}else if(parseInt(result)>0){
$(".modal-body").html(
"게시글 "+parseInt(result)+"번이 등록 되었습니다.");
}
$("#myModal").modal("show"); //모달창을 띄어죠
}
$("#regBtn").click(function(){
/* self는 window와 같다 */
self.location="/board/register";
});
});
</script> 2.식별키(pk)와 인덱스
(1)인덱스란?
데이터베이스에서는 테이블도 object이고, 인덱스도 object 이다.
인덱스는 실제 데이터가 있는 위치정보를 가지고 있다.
인덱스를 통해 실제 테이블에 있는 데이터로 접근이 가능하다.
(2)인덱스와 식별키(pk)의 관계
데이터베이스에서 pk를 생성하면 자동적으로 식별키(pk)와 함께 인덱스가 따라 붙게됨. 오라클에서는 그걸 'ROWID'(즉,인덱스)로 생성한다.
(3)인덱스와 실행계획
인덱스를 어떻게 실행할지 실행계획에 따라서 데이터베이스에 어떻게 접근할지 방법이 달라짐.
정렬을 할때 order by를 이용하는데, 이거는 1만건이하의 데이터를 다룰때는 문제가 없으나 데이터가 많아질수록 검색속도가 느려지기 때문에 가능하면 쓰지않는다.
order by대신 hint를 사용한다.
hint는 개발자의 의도를 전달하는 용도로 쓰이고, 컨맨드 처리가 되기때문에 SQL로 간주되지 않는다.
*여기서 개발자가 알아야할 힌트!!
FULL SCAN : 테이블에 포함된 레코드를 처음부터 끝까지 읽어들임
INDEX_ASC : 오름차순 정렬
INDEX_DESC : 내림차순 정렬
"INDEX_DESC(t_board pk_board)" 의미는 오라클아 t_board라는게 있는데,그안에 pk_board가 있거든 이걸 참고하여 INDEX를 내림차순으로 정렬해볼래??
"where bno>0"는 range scan descending 하게 만드는 요인
select /*+ INDEX_DESC(t_board pk_board)*/ rownum,bno,title,content from t_board where bno>0;힌트는 오라클데이터베이스에만 존재하며,데이터베이스의 크기가 커질수록 힌트를 쓰고 안쓰고의 어마어마한 성능차이를 보인다.
3.ROWNUM 과 인덱스
(1)실행계획이란? SQL문을 날렸을때, 데이터베이스에서 어떻게 처리되는 순서가 결정되는지 확인이 가능한게 실행계획을 보면 알수 있다.
이때 인덱스를 이용했을때 와 아닐때 어떻게 달라지는지 체크해봐야 한다.
(2)ROWNUM은 실제데이터는 아니고 가상데이터와 같음,출력되면서 붙는 번호이다.
즉, 먼저 테이블데이터에 액세스된 순위이다.
(3)ROWNUM 과 인덱스의 관계는 무엇인가?
처음에 가져올때는 ROWNUM을 가져온순서대로 순서없이 뒤죽박죽 정한후에, 그다음에 bno순으로 내림차순으로 정렬한다.
select /*+ FUll(t_board)*/ ROWNUM,BNO from tbl_board where bno>0 order by bno desc;
테이블에서 가장먼저 액세스되는 데이터가 ROWNUM의 1번순서가 된다.
아래와 같이 INDEX관련 힌트를 주면 t_board 를 bno순으로 정렬후에 bno가 큰번호부터 접근하므로 ROWNUM의 1번순서는 bno값이 가장 큰 데이터이다.
select /*+ INDEX_DESC(t_board PK_BPARD)*/ ROWNUM,BNO from t_board order by bno desc;그렇다면 순위를 왜 먹이나?
페이징 처리를 하기위함이다.
(4)페이징 처리하기 위한 sql문
최근글의 bno값이 가장 큰 데이터이다. 게시판에서 보여줄때 가장최근글이 1페이지에 존재함.
그렇다면 bno값이 가장 큰 데이터가 1페이지에 존재할려면 ROWNUM의 1번순서가 되어야하기 때문에 아래와 같은 코드가 탄생함
select /*+ INDEX_DESC(t_board PK_BPARD)*/ ROWNUM,BNO from t_board where bno>0 order by bno desc;그럼여기서 1페이지에 게시글 10개만 부르고 싶다면 어떻게 호출하나?
select /*+ INDEX_DESC(t_board PK_BPARD)*/ ROWNUM,BNO from t_board where 0<bno and rownum <=10 ;(5)rownum 의 조건
rownum 은 반드시 1 이 포함된 조건을 만들어줘야한다.
다시말해,
where 10<rownum and rownum <=20
조건을 지정시 1이 기준이기때문에 모든것이 무효가 됨.
(6)그렇다면 2page는 어떻게 출력하지??
아래와 같이 괄호안에 데이터가 또하나의 테이블로 간주됨.
'인라인뷰' 기법이라함.
여기서 ROWNUM 은 키워드이기 때문에 아래와 같이 임시의 컬럼을 만들어 줘야함.
왜? where 조건을 걸기위함
where 10<rn 조건을 걸어줌.
그럼 11~20까지만 출력이 된다.
select * from
(
select /*+ INDEX_DESC(t_board PK_BPARD)*/ ROWNUM rn,BNO from t_board where 0<bno and rownum <=20
)
where 10<rn