AJAXがデータを解析していないため、PATCHメソッドを使用していません

Question

私は比較的新しいAjaxです。私はPATCHとしてフォームを提出しようとしています.Mustache {{add_member_url}}によって送信されたURLを解析します。 、そしてバックエンドの作品、私はそれを試してみました。サーバーはGETを受け取りますが、私のフォームmethod="PATCH"、およびAjax method="PATCH"には、最初にAjaxに2つの関数があります。 - フォームを2番目にレンダリングします。フォームを送信するにはPATCHです。

はJavaScript

$('.list').on('click', '#add', function(event){ 
     event.preventDefault(); 
     var url_send = $(this).data("add_url") 
     // $("#yourModal").modal({"backdrop": "static"}); 
     $.get(''+$(this).data("add_url"), function(data){ 
      console.log(this); 
      var template = $("#add_member_template").html(); 
      console.log("T",template); 
      data.add_member_url = url_send; 
      console.log(data.add_member_url); 
      var rendered = Mustache.render(template, data); 
      console.log(rendered); 
      $('.contain').html(rendered); 

     }); 
    }); 



    $('.contain').on('submit', '#add_member', function(event){ 
     event.preventDefault(); 

     console.log('U',$(this).data("add_url")); 
     $.ajax({ 
      url:''+$(this).data("add_url"), 
      method: 'PATCH', 
      data: $(this).serialize(), 
      success: function(data) { 
       console.log(method); 

     } 
     }); 


    }); 
}); 

HTMLフォーム

<div id="forma" class="contain" ></div> 
    <script id="add_member_template" type="mustache/template"> 

    <form id="theForm" action="" method="PATCH"> 

      {% csrf_token %} 
      {% verbatim %} 

<p> {{pk}} </p> 
<p><label for="ssn">SSN:</label> 
<input id="ssn" type="text" name="tename" data-add_url="{{add_member_url}}" value="{{tename}}"></p> 

<button id="add_member" data-add_url="{{add_member_url}}" type="submit" value="save" class="btn blue">Submit</button> 



      {% endverbatim %} 
     </form> 

     </script> 

Answer 1

結合あなたのイベントが間違っています。 submitイベントはフォームでのみ発生し、送信ボタンでは発生しません。あなたはボタンのclickイベントにバインドする必要があります。

$(".contain").on("click", "#add_member", function(event) {... });