[웹][javascript] confirm() 으로 ajax 구문 실행

인트로

안녕하세요. 오늘은 confirirm()으로 ajax구문을 실행하는 방법을 포스팅하겠습니다.

자바스크립트에는, 대화상자로 alert, confirm, prompt가 있습니다. 

1) alert() : 단순히 메시지 전달
2) confirm() : 확인 , 취소에 따라 true, false를 반환 
3) prompt() : 알림창에서 사용자가 입력한 값을 받아서 리턴

그 중 확인, 취소에 따라 true, false를 반환하는 confirm()에 대해서 사용법을 알아볼 것입니다.  (확인을 누르면 ajax 구문 실행) 

 

confirm()의 사용법

confirm()의 사용법은 아래와 같다. 
1) 자바스크립트 confirm() 이용해서 확인창 띄우기
- 다음과 같이 if문을 이용해 confirm()의 결과에 따라 true, false를 반환한다. 

if(confirm('정말 제출하시겠습니까?'))   
	return true;
else  
	return false;

 

2) 취소 누른경우 아무 동작도 실행하지 않기 
** 이때, 반드시 else에 false를 return 해주어야 취소에 대해 아무런 동작도 하지 않는다 . 

 

3) 확인 누르면 ajax로 DB에 POST로 데이터 던지기
'확인'을 누른 경우 confirm()의 결과가 true로 반환되므로, if 문안에 아래와 같이 ajax 구문을 넣는다. 

코드

$('#btn_submit').on('submit', function(e) {

    e.preventDefault();

    if(confirm('정말 제출하시겠습니까?')) //확인 누르면 true, 취소 누르면 false

    {   

        $.ajax({

           type: "POST",

           url: "api/notes/{{$note->_id}}",

           data: data, 

           contentType: false,

           success: function(data)

           {

                window.location.replace('url');

           },

           fail: function(data)

           {

                alert('failed');

           },

           error: function(data)

           {

            if (data.status == 401) {

                alert('failed.');

                return;

            }

           }

        });

    }

    else

    {

        return false;

    }

});