模态表单使用Jquery .ajax向PHP提交

我试图使用php，jquery .ajax将一个模态表单发布到一个表但它永远不会工作..尝试使用firebug调试，我没有看到任何错误。 我使用form action =“notes_functions.php”测试了表单，它工作正常。

Profile.php

 
 
 Title  Note  Note type 
  
 Attach a document  
PDF, DOCX and image files are supported.
 
   Check me out <input type="label" name="note_account" value=""/>  
 <input type="hidden" name="note_creator" value=""/> 
 ADD 
  

这是我的js代码

 $(function(){ $("button#submitnote").click(function(){ $.ajax ({ type:"POST", url:"notes_functions.php", data: $('form.noteform').serialize(), success: function(msg){ $("#thanks").html(msg) $("form.noteform").modal('hide'); }, error: function(){ alert("failure"); } }); }); }); 

notes_functions.php

Answer 1

您应该使用.submit（）而不是单击（对于submit-by-enter等）并返回false以阻止常规提交。 您还需要确保在创建表单元素后运行绑定事件的代码。 最简单的方法是将它放在文档就绪处理程序中。

 jQuery(document).ready(function ($) { $("#notesmodal").submit(function () { $.ajax({ type: "POST", url: "notes_functions.php", data: $('form.noteform').serialize(), success: function (msg) { $("#thanks").html(msg) $("form.noteform").modal('hide'); }, error: function () { alert("failure"); } }); return false; }); }); 

并将ADD按钮更改为：