[31일차]- 삭제 & 삭제 메세지 JQuery 구현

새싹개발자 2020. 12. 27. 00:55

페이징 처리를 마무리했다.

다음은 데이터를 삭제하는 기능을 구현해보자,

AdminController에 member_delete()를 생성한다.

@RequestMapping(value="/admin/member/member_delete", method=RequestMethod.POST)
public String member_delete(RedirectAttributes rdat, @RequestParam("user_id") String user_id) throws Exception{
  memberService.deleteMember(user_id);
  //Redirect로 페이지 이동 시 전송값을 숨겨서 보내는 역할을 하는 클래스 : RedirectAttributes
  rdat.addFlashAttribute("msg", "삭제");
  return "redirect:/admin/member/member_list"; //?success=OK
}

member_view.jsp의 버튼영역을 수정하고 delete버튼을 눌렀을 때 수행되는 기능을 jQuery로 작성한다.

jquery의 위치는 footer 아래에 작성한다.

<script>
$(document).ready(function(){
	$("#deleteBtn").bind("click", function(){
		if(confirm("정말 삭제하시겠습니까?")){
			$("#action_form").attr("action", "/admin/member/member_delete");
			$("#action_form").attr("method", "post");
			$("#action_form").submit();
		} //confirm() 자바 스크립트 함수 반환값은 true/false
	});
});
</script>

member_view.jsp의 deleteBtn을 click한 순간,

action="/admin/member/member_delete"로 인해 post방식으로 submit된다.

input의 value="${memberVO.user_id}"값이 name="user_id"에 저장되어 쿼리쪽으로 보내진다.

-> delete from ~ 실행 -> 삭제 완료.

삭제가 완료되면 "삭제가 완료되었습니다."라는 창을 띄울 것이다.

header.jsp 상단,<head> 안쪽에 javascript를 추가한다.

<script>
if('${msg}' != ''){ //자바의 EL표기법 달러{변수명}
	alert("${msg} 가(이) 완료되었습니다.");
}
</script>

- AdminController의 msg가 공백이 아니라면(member_delete가 실행된다면) alert해라.

저작자표시 (새창열림)