bootstrap обработка формы ajax

Я пытаюсь загрузить эту форму на пару дней, но все, что я могу получить, это форма отправки страницы (не то, что я хочу, я хочу, чтобы форма была представлена, а затем закрыта модальная, а затем сообщение успеха от news.php в держателе div «спасибо»).

Может ли кто-нибудь выявить проблему, с которой я столкнулся, когда она загрузит страницу «news.php»?

• Как создать PDF из HTML с помощью классов начальной загрузки CSS
• вложенные в петлю трудности
• Bootstrap - требуется скрывать контент до тех пор, пока модальные нагрузки
• Как отображать динамический контент из удаленного файла в bootstrap modal с помощью php?
• bootstrap twitter datepicker + modal - календарь на родительском экране вместо модального экрана

<div id="thanks"></div> <div class="modal fade" id="newsModal" tabindex="-1" role="dialog" aria-labelledby="newsModalLabel" aria-hidden="true"> <div class="modal-dialog"> <div class="modal-content"> <div class="modal-header"> <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button> <h4 class="modal-title" id="newsModalLabel">Add a News Post</h4> </div> <div class="modal-body"> <form class="addNew" role="form" method="POST" action="news.php"> <div class="form-group"> <input type="text" name="title" class="form-control" id="title" placeholder="Enter title here..."> </div> <div class="form-group"> <textarea class="form-control" name="message" rows="7" placeholder="Enter news post here..."></textarea> </div> </div> <div class="modal-footer"> <button type="button" class="btn btn-default" data-dismiss="modal">Close</button> <button type="submit" class="btn btn-primary" id="addNews">Add News Post</button> </form> </div> </div> </div> </div> 

и javascript:

 <script type="text/javascript"> $(document).ready(function () { $("button#addNews").click(function(){ $.ajax({ type: "POST", url: "news.php", data: $('form.addNew').serialize(), success: function(msg){ $("#thanks").html(msg) //hide button and show thank you $("#newsModal").modal('hide'); }, error: function(){ alert("failure"); } }); }); }); </script> 

 <script type="text/javascript"> $(document).ready(function (e) { // pass the event object $("button#addNews").click(function(){ e.preventDefault(); // disable the POST of the form by the submit button $.ajax({ type: "POST", url: "news.php", data: $('form.addNew').serialize(), success: function(msg){ $("#thanks").html(msg) //hide button and show thank you $("#newsModal").modal('hide'); }, error: function(){ alert("failure"); } }); }); });