바뀜

둘러보기로 가기 검색하러 가기
1,699 바이트 추가됨 ,  2021년 7월 26일 (월) 21:53
18번째 줄: 18번째 줄:  
     return HttpResponse(json.dumps(context), context_type="application/json")
 
     return HttpResponse(json.dumps(context), context_type="application/json")
 
</syntaxhighlight>
 
</syntaxhighlight>
 +
 +
== ajax 사용 ==
 +
 +
=== html에 직접 입력 ===
 +
<syntaxhighlight lang="html+django">
 +
<script type="text/javascript">
 +
(function(){
 +
    const contents = document.querySelector('#클래스명')
 +
    const textField = document.querySelector('#입력하는 창의 클래스')
 +
   
 +
    function contentsFunc(e){
 +
        let elem = e.target;  /*클릭한 타겟을 객체화 한다.*/
 +
        while (!elem.getAttribute('속성')){
 +
            elem = elem.parentNode;  /*객체가 해당 속성을 갖고 있을 때까지 찾는다..*/
 +
            if (elem.nodeName === 'BODY'){
 +
                elem = null;
 +
                return;  /*BODY까지 올라갔는데 없으면 아무것도 반환하지 않는다.*/
 +
            }
 +
        }
 +
        if (elem.matches('[속성="속성값"]')){
 +
            const pk = elem.getAttribute('name');  /*name속성에 좋아요를 할 객체의 pk를 담아둔다.*/
 +
           
 +
            $.ajax({
 +
                type: "POST",
 +
                url: "{% url '인덱스' %}",
 +
                data: {'pk':pk, 'csrfmiddlewaretocken': '{{csrf_tocken}}'},  /*csrf토큰도 담아준다.*/
 +
                datatype: "json",
 +
                success: function (response){
 +
                    alert('성공');},
 +
                error: function (request, status, error){
 +
                    alert("code:"+request.status+"\n"+"message:"+request.responseText+"\n"+"error:"+error);}
 +
               
 +
            })
 +
        }
 +
    }
 +
   
 +
   
 +
    contents.addEventListener('click', contentsFunc);
 +
   
 +
})   
 +
   
 +
   
 +
   
 +
</script>
 +
</syntaxhighlight>[error함수 안에서 resuest 등을 탬플릿 필터를 사용하지 않고 사용하는데, 이건 어떻게 가능한 걸까;;]
 
[[분류:장고 기능구현(중급)]]
 
[[분류:장고 기능구현(중급)]]
익명 사용자

둘러보기 메뉴