입력 수정 삭제 완료 [ alert( ) ] 경고창 로직

입력,수정,삭제가 완료된 후에는 항상 작업이 수행되고 수행된 작업을 재요청을통해 화면에 띄워줄수있도록 Redirect처리를 해줍니다.

 

이때 자바스크립트를 통해 수정이 완료되고 페이지전환이 될때 자바스크립트의 alert('')경고창을 통해 작업이 성공적으로 처리가 되었다는 문구를 사용자에게 띄워줄 수 있습니다.

 

@PostMapping("/write")
    public String write(BoardVO board, RedirectAttributes ra) {
        service.insert(board);
        ra.addFlashAttribute("msg","wrtSuccess");
        return "redirect:/list";
    }
@PostMapping("/modify")
    public String write(BoardVO board, RedirectAttributes ra) {
        service.insert(board);
        ra.addFlashAttribute("msg","modSuccess");
        return "redirect:/content";
    }
@PostMapping("/delete")
    public String write(BoardVO board, RedirectAttributes ra) {
        service.insert(board);
        ra.addFlashAttribute("msg","delSuccess");
        return "redirect:/list";
    }

 

먼저 redirect시에도 값을 잃지않고 전송해줄 수 있는 RedirectAttributes 객체를 생성하여 addFlashAttribute('키','값')

메서드를 호출하여 "키","값" 쌍으로 성공문자열을 담아 각각 재요청되어 실행되는 JSP단으로 던져줍니다.

 

 

list페이지 자바스크립트 로직

<script>
const result ="${msg}"
if(result==="regSuccess"){
    alert('게시글 작성 완료!');
} else if(result==="delSucess"){
    alert('게시글 삭제 완료!');
}
</script>

content 페이지 자바스크립트 로직

<script>
const result ="${msg}"
if(result==="delSuccess"){
    alert('게시글 삭제 완료!');
}
</script>

이 로직은 조건에 부합할때 alert('')경고창을 띄울수있게 되어있는 로직입니다.

 

 

자바스크립트에서는 변수의 타입을 var라는 키워드로 지정합니다.

또한 es2015 버전부터는 변수가 let으로 바뀌게되었고 const라는 상수키워드가 생겼습니다.

 

 

각 페이지에서는 "키"를 ${EL}로 받아 "키"가 담고있는 "값"을 const 상수타입의 result에 저장해줍니다.

reesult상수에 저장된 "키" 가 "문자열" 과 === 같다면 alert('완료!') 경고창을 띄울수있게 되어있는 로직입니다.