2017-02-22 6 views
0

私はこのフォームのテーブルを自分のフォームに入れて、AJAXポストを送るためにチェックボックスをクリックするたびに必要です。 問題は、AJAX投稿が最初のアイテムに対してのみ送信されていることです。チェックボックがクリックされるたびにAJAXポスト

私はここで他の質問を読んだことがありますが、解決策の周りに私の頭を包むことはできません。

また、これは私のdjango/pythonアプリケーションにあります。

ありがとうございます!

マイフォーム/テーブル:

<form method="post" action="{% url 'myapp:ajax-function' %}"> 
    <table> 
    <tr> 
     <td> 
     Number: <input type="text" name="number" /> 
     </td> 
     <td> 
     Title: <input type="text" name="title" /> 
     </td> 
     <td> 
     Insert:<input id="check" type="checkbox" data-id={{ doc.id }} name="checkebox"/> 
     </td> 
    </tr> 
    </table> 
</form> 

私のAJAX:

$("#check").each(function(){ 
    $(this).on("click", function(){ 
     var checked = $('#check').val(); 
     var message_id = $('#check').attr('data-id'); 


     $.ajax({ 
       url : "{% url 'myapp:ajax-function' %}", 
       //async: false, 
       type : "POST", 
       data:{ 
       'csrftoken':getCookie('csrftoken'), 
       checked:checked, 
       message_id:message_id}, 

     success : function(result) { 
      console.log(result); // sanity check 

     }, 


     error : function(xhr,errmsg,err) { 
     console.log(xhr.status + ": " + xhr.responseText); 
     }, 

     }); 
    }); 

}); 

答えて

2

要素Idは一度だけoccure必要があります。あなたのチェックボックスにクラスを割り当て、セレクタを変更:

Insert:<input class="check" type="checkbox" data-id={{ doc.id }} name="checkebox"/>

$(".check").each(function(){ 
//........ 
関連する問題