postman 이용
삭제 버튼을 누르면 자바스크립트 함수가 실행되고 ajax로 통신하면서 응답 받는다.
자바스크립트 매개변수에서 add.attribute로 가지고 있는 id 값들을 함수 매개변수에다가 넣어주면 됨
<button class="btn btn-danger" onclick="deleteById(${detailDto.boardDto.id} )">삭제</button>
// 보시다시피 매개변수를 저렇게 넣어준다
여기서 deleteById 함수가 호출되고 매개변수의 특정한 값이 보내지게 됨.
deleteById를 살펴보자
여기서 생각해야될 것은
form 태그의 데이터 이동행동이 있다 대신에 ajax를 해주는 것을 이해하면 됨.
function deleteById(id){
// 매개변수로 가져온 id를 데이터로 담아서 보내야함
let data = {
id : id
}
$.ajax({
type: "DELETE",
url: "/delete",
data: data,
contentType: "application/x-www-form-urlencoded; charset=utf-8",
// 버튼클릭했을 때 사용하는 contentType은?
// data가 key:value로 보내진 것을 주목
dataType: "text",
}).done(function(resp){
console.log(resp);
if(resp == 1){
alert("삭제 성공");
location.href="/";
} else {
alert("삭제 실패");
}
}).fail(function(error){
console.log(error.responseText);
console.log("서버 오류");
});
그리고 이것을 보내면 Controller에서 처리해줘야 됨
<delete id="deleteById">
DELETE FROM post
WHERE id = #{id}
</delete>
public int deleteById(int id);
// 지워지면 1 안지워지면 0 int로 해서 return 값을 받음
데이터 타입을 Post로 잘못적었다. select로 데이터를 조회할 때는 Post 데이터 타입을 쓰겠지만
deleteById로 행동을 하고 return으로 삭제됐어 안됐어의 답만 받으면 된다. Post 객체 자체를 받을 이유가 없음 아무 것도 받을 필요 없으면 void지만 확인 여부로 해줘야되기 때문에 int로 return 해줌