본문 바로가기
IT

[ajax] Post 데이터 전송 후 새로고침 하는 방법

by 쪼이빠빠 2023. 3. 15.
728x90
반응형

Ajax를 활용하여 데이터를 POST 형태로 전송하고 페이지를 새로고침 하는 방법이다.

request가 완료된 후 

 

document.location.href=document.location.href;

 

이걸 넣어주면 새로고침이 된다.

 

    $(function(){
        var form = $('#frm')[0];
        var form_data = new FormData(form);

        var btn = function(){
            var request = $.ajax({
                type: "POST",
                enctype: 'multipart/form-data',
                url:"{% url 'addUser' %}",
                data: form_data,
                processData: false,
                contentType: false
            });
            request.done(function(data){
                alert("Complete");
                document.location.href=document.location.href;
            });
            request.fail(function(jqXHR, textStatus){
                alert( "Fail Sync: " + textStatus );
            });
        };

        $('#btn').click(function(){
                        
            if($('#name').val()==''){
                alert("name 입력.");
                $('#type').focus();
                return false;
            }
            if($('#age').val()==''){
                alert("age 입력.");
                $('#age').focus();
                return false;
            }


            form_data.append("name",$('#name').val());
            form_data.append("age",$('#age').val());
            form_data.append("csrfmiddlewaretoken","{{ csrf_token }}");
            btn();
        });
    });

참고로 해당 코드는 Django 프레임워크를 활용하여 Ajax POST를 수행하는 코드 이다.

반응형

댓글