jQueryのは - 、私は以下のような形を持っている

Question

でpreventDefault（）を呼び出した後

<form id="compose" method="post" name="new_message"> 
<div id="new_message"> 
    <div> 
     <label class="required" for="new_message_subject">Subject</label> 
     <input type="text" class="form-control" required="required" name="new_message[subject]" id="new_message_subject"> 
    </div> 
    <div> 
     <label class="required" for="new_message_receiver">To</label> 
     <select class="form-control" name="new_message[receiver]" id="new_message_receiver"> 
      <option value="2">fnamexxxxx lname</option> 
      <option value="5">tester testerlast</option> 
      <option value="7">bummer bumlast</option> 
     </select> 
    </div> 
    <div> 
     <label class="required" for="new_message_content">Content</label> 
     <textarea class="form-control" required="required" name="new_message[content]" id="new_message_content"></textarea> 
    </div> 
    <div> 
     <button class="btn btn-primary" name="new_message[Compose]" id="new_message_Compose" type="submit">Compose</button> 
    </div> 
     <input type="hidden" name="new_message[_token]" id="new_message__token"> 
</div> 

をフォームを送信し、私は、フォームの送信を停止したpreventDefault()を使用して、確認のためにブートストラップモーダルを使用しましたメッセージが表示され、私のJquery関数とブートストラップモーダルを以下で見ることができます。

<script> 
    document.getElementById("compose").addEventListener("submit", function(event){ 
     event.preventDefault(); 

     var title = $("#new_message_subject").val(); 
     var to  = $("#new_message_receiver :selected").text(); 
     var message = $("#new_message_content").val(); 

     $('#title').text(title); 
     $('#to').text(to); 
     $('#message').text(message); 

     $('#myModal').modal('show'); 

     $('#send').click(function(){ 
      // avoid preventDefault() and submit form code here 
     }); 
    }); 
</script> 
<div class="modal fade" tabindex="-1" role="dialog" id="myModal"> 
    <div class="modal-dialog" role="document"> 
     <div class="modal-content"> 
      <div class="modal-header"> 
       <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button> 
       <h4 class="modal-title">Message send confirmation</h4> 
      </div> 
      <div class="modal-body"> 
       <h4 id="title"></h4> 
       <p><b>To</b></p> 
       <p id="to"></p> 
       <p><b>Message</b></p> 
       <p id="message"></p> 
      </div> 
      <div class="modal-footer"> 
       <button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button> 
       <button type="button" id="send" class="btn btn-primary">Send</button> 
      </div> 
     </div><!-- /.modal-content --> 
    </div><!-- /.modal-dialog --> 
</div><!-- /.modal --> 

ユーザーがフォームを送信ボタンをクリックすると、シナリオがあり、その後、ブートストラップモーダルがポップアップし、フォームの送信を確認するように依頼し、ユーザーがクリックした場合はボタンを送る、id="send"は、フォームは何をする必要があり、そのアクション/提出。

ここで私がしようとしているのは、ユーザーがボタンを送信してフォームを送信する必要がある場合です。私はこれを行ういくつかの方法を試みたが、preventDefault()を避けてフォームを送信できなかった。

Answer 1

スクリプトコードは次のとおりです。

<script> 
    $("#compose").submit(function (objEvent) { 
     objEvent.preventDefault(); 
     var title = $("#new_message_subject").val(); 
     var to = $("#new_message_receiver :selected").text(); 
     var message = $("#new_message_content").val(); 
     $('#title').text(title); 
     $('#to').text(to); 
     $('#message').text(message); 
     $('#myModal').modal('show'); 
     $(this)[0].submit(); 
    }) 
</script>