Django：テンプレート内で変数とHTML IDを結合する

Question

私は、Javascript変数を使ってdjangoオブジェクトリスト（views.pyのget_querysetを介して取得）を "連結"する方法を探しています。それらをモデルオブジェクトのフィールドに連結します。

私のモデルはブログ投稿であり、post_titleフィールド（チャーフィールド）を含んでいます。 私のindex.htmlには、ページのインデックスとonClick = "displayPostContentOnPageButtonCliked（this.id）"属性に対応するid = "1"またはid = "2"のページャボタンがあります。

私のindex.htmlは、all_post_by_dateというcontext_object_name内のすべてのポストオブジェクトを取得します。私のindex.htmlで 、私は警告ダイアログ上のボタンに対応した記事のタイトルを表示するには、クリックされたようなもの：

<script> 
    function displayPostContentOnPageButtonCliked(page_button_clicked_id){ 
     var all_posts_by_date = "{{all_posts_by_date.page_button_clicked_id.post_title}}"; 
     alert(all_posts_by_date); 
    } 
</script> 

しかし、これは動作しません。フィルタを追加したり、独自のフィルタを作成しようとしましたが（get_indexと呼ばれていましたが、all_posts_by_date | get_index：page_button_clicked_idのようになり、.post_title部分を組み合わせることはできません） 質問：{{all_posts_by_date.page_button_clicked_id .post_title}}を実行し、ボタン3をクリックしたときに「投稿3のタイトル」を警告しますか？ ありがとう！

Answer 1

2つのソリューション：（1）JS関数に必要なデータをJS関数の呼び出し

<script> 
    function showPostTitle(post_title){ 
     alert(post_title); 
    } 
</script> 

. . . 
{% for x in all_posts_by_date %} 
<div id='blog-post-{{ x.id }}' on-click="showPostTitle('{{ x.post_title }}')"> 
. . . 
{% endfor %} 

それとも、単に後で使用するためのデータを自分でシリアライズすることができます。

<script> 
    var titles = []; 
{% for x in all_posts_by_date %} 
    titles.push('{{ x.post_title }}'); 
{% endfor %} 
    function displayPostContentOnPageButtonCliked(nId) { 
     var title = titles[nId - 1]; 
     alert(title); 
    } 
</script>