引導模態ajax表單提交返回空$ _POST

Question

我想用ajax提交我的模態表單。首先，我填寫一些預定義的數據。這部分工作。然而，當我點擊提交按鈕時，我確實碰到了我的form.php腳本，但在腳本中，$ _POST是空的。我在這裏做錯了什麼？

<div class="modal fade" id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel"> 
    <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" id="exampleModalLabel">Edit MAC alias</h4> 
      </div> 
      <div class="modal-body"> 
       <form class="macalias" name="macalias" id="macalias"> 
        <input type="hidden" class="form-control" id="valmac" name="valmac"> 
        <div class="form-group"> 
         <label for="message-text" class="control-label">Alias:</label> 
         <input type="text" class="form-control" id="valalias" name="valalias"> 
        </div> 
        <div class="modal-footer"> 
         <button type="button" class="btn btn-default" data-dismiss="modal">Close</button> 
         <button type="submit" class="btn btn-default" data-dismiss="modal">Save</button> 
        </div> 
       </form> 
      </div> 
     </div> 
    </div> 
</div> 


<script> 
    $(function() 
    { 
    // fill the form with data (this part works) 
    $('#exampleModal').on 
    ('show.bs.modal', function (event) 
     { 
      var button = $(event.relatedTarget) 
      var valmac = button.data('valmac') 
      var valalias = button.data('valalias') 
      var modal = $(this) 
      modal.find('.modal-title').text('Edit alias for ' + valmac) 
      modal.find('.modal-body input[id=valmac]').val(valmac) 
      modal.find('.modal-body input[id=valalias]').val(valalias) 
     } 
    ) 

    $(".macalias").submit(function(event) { 
     //cancel the default submit action by calling 
     event.preventDefault(); 
     $.ajax({ 
      type: "POST", 
      url: "form.php", 
      data: $('form#macalias').serialize(), 
      success: function(msg){ 
       $('#exampleModal').modal('hide') 
      }, 
      error: function(){ 
       alert("failure"); 
      } 
     }); 
    }); 
}); 
</script> 

編輯：代碼工作現在

Answer 1

你的表格上類名爲macalias所以它應該是

data: $('form.macalias').serialize() 

編輯！

您可以聽按鍵（回車），但是我認爲最好附加表單提交的事件處理程序。更換

$("input#submit").click(function(){...}); 

與

$(".macalias").submit(function(event) { 
    //cancel the default submit action by calling 
    event.preventDefault(); 

    //Your ajax stuff 
}); 

，並切換到一個提交按鈕

<button type="submit" class="btn btn-default" data-dismiss="modal" >Close</button>