6월 24일 에러 (thehouseProject)

팔로우 기능 script ajax처리 안되던것 해결.

 

상대방 아이디를 넘겨줬어야 하는데 그게 안되는 상황.

$(function(){
    $("#follow").click(function(){
        
        var follow = $("#fol").val();
        
        $.ajaxSettings.traditional=true;
        $.ajax({
            type : "post",
            url : "/follow",
            data : {followId : follow}
            success : function(data){
            
                location.reload();
            },
        });
    });
});

 

이렇게 작성했으나 안넘어감.

뷰에서는 처음에 그냥

<th:block th:text="${profile.memberId}" id="fol" name="fol">

이부분을 넘기고 싶었으나 도저히 값이 넘어오지 않아서 포기...

결국

<input type="hidden" id="fol" name="fol" th:value="${profile.memberId}">

이렇게 input 태그를 만들어줘서 넘겨줬다.

그랬더니 console에는 찍히나 넘어가질 않았음.

 

$(function(){
    $("#follow").click(function(){
        var follow = {
            followId: $("#fol").val(),
        };
        console.log(follow);
        
        $.ajaxSettings.traditional=true;
        $.ajax({
            type: "post",
            url: "/follow",
            data : follow,
            datatype : "json",
            success : function(data){
            
                location.reload();
            },
        });
    });
});

 

이렇게 변경

상구씨가 도와줬는데 var follow = { key : value }

이렇게 넘겨줘야 한다고 팁을 주심.

 

이렇게 했더니 memberId값이 컨트롤러로 잘 넘어감.

 

이제 문제는 팔로우 버튼을 눌렀을 때 팔로우, 팔로우취소로 변경이 바로바로 되었으면 했으나

직접 새로고침을 하지 않는이상 안넘어가는 에러 발생...

 

그래서 혹시나 하고 success 밑에 alert창을 하나 추가해봤으나 출력이 안됨

success로 넘어오질 않는 상황이었음.

 

이것저것 찾아보다가 답이 나오지 않아서 혹시나 하고 dataType을 지워봄.

 

바로 출력.............

 

문제는 내가 넘겨주는 데이터가 json이 아닌데 json으로 넘기니 당연히 문제 발생하는것.

 

이럴때는 stringfy를 사용한다고 한다.

 

찾아보니 

http://credemol.blogspot.com/2011/08/jquery-ajax-datatype-json.html

이 블로그에서 설명을 해주심.

 

JSONP(JSON with Padding)와 관련이 있다고 한다.

 

JSONP는 동적 스크립트 삽입 기능을 이용한다.

 

ajax에서 dataType을 'json'으로 설정하면 jquery는 callback이라는 파라미터를 Timestamp를 이용하여 중복되지 않은

함수명으로 만들어 request의 파라미터로 전달한다.

 

서버에서는 contentType을 text/javascript로 설정해야 하고 request의 파라미터로 전달된 callback함수를 호출하거나

함수의 파라미터를 json객체를 전달한다.

 

이분 생각으로는 아마 하나만 전달할 수 있을 것 같다고한다.

 

테스트 해봐야할듯...