AJAX로 삭제요청하기 3 (jQuery를 이용한 UI 기능) & 여러가지 응답방법 챕터입니다.
<ul class="list-group">
<% for (var i = 0; i < posts.length; i++){ %>
<li class="list-group-item" >
<p>글번호 : <%= posts[i]._id %></p>
<h4>할일 제목 : <%= posts[i].제목 %></h4>
<p> 할일 마감날짜 : <%= posts[i].날짜 %> ></p>
<button class="delete" data-id= <%= posts[i]._id %> >삭제</button>
</li>
<% } %>
</ul>
<script src="https://code.jquery.com/jquery-3.5.1.min.js" ></script>
<script>
$('.delete').click(function(e){
var 글번호 = e.target.dataset.id;
var 지금누른거 = $(this);
$.ajax({
method: 'DELETE',
url: '/delete',
data: { _id : 글번호 }
}).done(function(결과){
console.log('성공햇어염.');
지금누른거.parent('li').fadeOut();
}).fail(function(결과){
console.log('실패했지롱');
});
});
삭제 버튼 누를시 db 에서 삭제는 정상적으로 되었습니다. 그런데 400 (Bad Request) 콘솔에서 이런 오류가 있다고 알려줍니다.
jquery-3.5.1.min.js:2 DELETE http://localhost:8080/delete 400 (Bad Request)
send @ jquery-3.5.1.min.js:2
ajax @ jquery-3.5.1.min.js:2
(anonymous) @ list:92
dispatch @ jquery-3.5.1.min.js:2
v.handle @ jquery-3.5.1.min.js:2
실패했지롱
이런 결과가 나옵니다.
정상적으로 작동하는데 왜 .done 이 실행이 안되고 fail 이 작동한는지 궁금합니다.
