2017-11-26 7 views
-1

자바 스크립트에서 ajax를 사용하여 html 페이지를 채우는 데이터베이스 정보를 보내고받습니다. 데이터를 받으면 div 요소에 추가합니다. 내가 추가하는 모든 객체에는 삭제 기능이 있어야합니다. 그래서 내가 그 개체의 고유 ID를 따라 전달하는 온 클릭 방법을 만들JavaScript의 장고 메서드로 인해 TemplateSyntaxError가 발생합니다.

내 문제는 내가 제대로이 호출에 대한 따옴표와 함께 장고 url 방법을 포맷 할 수없는 것이다 : onclick='removeFile("{% url 'delete_file' model['pk'] %}");' 전체 라인은 다음과 같이 :

$('#gallery tbody').append("<tr><td><a href='" + object['url'] + "'>" + object['file'] + "</a><span style='float:right'><button type='button' id='delete_button' class='btn btn-lg btn-danger' onclick='removeFile("{% url 'delete_file' model['pk'] %}");'></button></div></td></tr>") 

내가 오류는 TemplateSyntax 오류입니다

나머지 구문 분석 할 수 없습니다 : '모델 ['PK ']'

에서 '['PK '를]

콘솔에 'model['pk']'의 값을 기록하면 올바른 ID를 얻고 onclick 메서드를 삭제해도 올바르게로드됩니다 (삭제 기능은 없습니다). 나는이

<button type="button" class="glyphicon glyphicon-remove-sign" onclick='removeFile("{% url 'delete_file' a.pk %}"); return false'> </button>a처럼 html에 직접 퍼팅 시도했다

장고의 모델 객체이며, 그것을 잘 작동합니다.

javascript 추가 메서드에 onclick 메서드를 제대로 추가하려면 어떻게해야합니까?

전체 자바 스크립트 함수

은 여기에 있습니다 : 다니엘은 지적 자바 스크립트는 클라이언트 측을 실행되는 동안, 장고 방법은 서버 측을 평가

 function GetObjects(){ 
      //Retrieves an updated list of objects and displays them on the page 
      $.post("{% url 'getobjects' %}",getCallback).fail(failCallback); 
     } 
     function getCallback(data){ 
      $('#gallery tbody').empty()//Empty the list 
      //Populate it 
      for(var i=0;i<data.length;i++){ 
       var model = data[i] 
       var object= model['fields'] 
       ///////////////ERROR LINE: 
       $('#gallery tbody').append("<tr><td><a href='" + object['url'] + "'>" + object['file'] + "</a><span style='float:right'><button type='button' id='delete_button' class='btn btn-lg btn-danger' onclick='removeFile("{% url 'delete_file' model['pk'] %}");'></button></div></td></tr>") 
      } 

     } 
     function failCallback(failMessage){ 
      console.log(failMessage.responseText) 
     } 
     GetObjects() 
+1

이 가능성이 작동하지 않을 수 있습니다. JavaScript가 브라우저로 전송되기 전에 Django 템플릿이 클라이언트 측에서 완전히 렌더링됩니다. –

+0

좋아, 내가 별도의 onclick 메서드를 사용하여 해결해야 할 것 같아요. – Magnus

답변

0

. 여기 내 문제에 대한 해결책은 매개 변수없이 동일한 URL을 추가하는 것이 었습니다. 그런 다음 동일한 URL을 가리 킵니다. 따라서 템플릿은 잘 컴파일되고 JavaScript가 실행될 때 올바른 URL로 보내지고 예상대로 실행됩니다. 이 함수 E가 일반 HTML 목적

function removeFile(e){ 
     $.post("{% url 'delete_file' %}/" + e.id) 
} 

를 실행하는 버튼을 생성하는

$('#gallery tbody').prepend("<tr><td><a href='" + object['file_url'] + "'>" + object['file'] + "</a><span style='float:right'><button type='button' id='"+ model['pk']+"' class='glyphicon glyphicon-remove-sign ' onclick='removeFile(this)'></button></div></td></tr>") 

:

여기서 올바른 jQuery를이다.

urls.py

url(r'^delete_file/(?P<file_id>[-\w]+)$', views.delete_file, name='delete_file'), 
url(r'^delete_file$', views.delete_file, name='delete_file'),