Ajax経由でオブジェクトのプライマリキーを送信する

Question

SELECTEDオブジェクトのプライマリキー（pk）をAJAX経由で送信する方法私は{{pk}}を試みましたが失敗しました。私は、「不明なエラー」予期しないトークン}エラーを取得しています

{% extends 'homepage.html' %} 
{% load staticfiles %} 

{% block teacher_diary %} 
<script language="JavaScript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.0/jquery.min.js"></script> 
<script type="text/javascript"> 
    $(document).ready(function(){ 
     $('#grade_list').change(function(){ 
     var element = document.getElementById("grade_list"); 
     var value = element.options[element.selectedIndex].value; 
    $.ajax({ 
     url: "get_subject/", 
     type: "get", 
     data: { 
      'grade_id': value.{{ pk }} 
     }, 
     dataType: "json" 
    }); 

})}); 
</script> 
<select id="grade_list"> 
    {% for grade in grades %} 
     <option >{{ grade }}</option> 
    {% endfor %} 
</select> 

Answer 1

valueとして識別あなたの変数と呼ばれる任意の属性を持っていない{{PK}}。二重中括弧の使用は、HTMLがクライアントに送信される前に、テンプレートのサーバー側の処理用に予約されています。クライアントサイドにDjangoオブジェクトの概念はありません。うまくいけば、これは直感的な意味を持っています。

解決策として、ここで私がするかもしれない何かがあります。まず、各オプションにサーバー側からpkを格納するカスタム属性data-pkを付けます。

<select id="grade_list"> 
    {% for grade in grades %} 
     <option data-pk={{grade.pk}} >{{ grade }}</option> 
    {% endfor %} 
</select> 

次に、JavaScriptを使用してpkにアクセスします（JQueryを使用する場合は、簡単な方法があります）。

var element = document.getElementById("grade_list"); 
    var value = element.options[element.selectedIndex]; 
    $.ajax({ 
     url: "get_subject/", 
     type: "get", 
     data: { 
      'grade_id': value.getAttribute("data-pk"); 
     }, 
     dataType: "json" 
    });