使用Ajax手動提交表單

Question

我正在嘗試使用ajax在表單提交上調用servlet。 但這並沒有達到ajax和頁面重新加載的目的。 我手動觸發表單提交，然后在該提交功能上調用ajax方法。

 $("#image1").on('change', function(event) { $('#myform').trigger('submit'); alert("button clicked"); // this is submitted $("#myform").submit(function(e) { // this is not happening event.preventDefault(); alert('form clicked'); //var formId=("#myform").submit(); $.ajax({ type: 'GET', // GET or POST or PUT or DELETE // verb url: "/bin/mr/controller?q=iechange", data: $("#myform").serialize(), // type // sent // to // server dataType: 'json', // Expected data format from // server processdata: true, // True or False success: function(data) { // On Successfull alert('call success'); console.log(data); }, error: function(msg) { // When Service call alert('call fail'); // fails } }); }); }); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <form id="myform" > <input name="img" id="image1" type="file" accept="image/*"> </form> 

Answer 1

頁面加載時，您需要綁定您的submit事件處理程序。

當前，您正在嘗試手動觸發提交后綁定它……這太晚了，因為該事件已經過去了。

將綁定了submit事件的代碼移到change事件的事件處理程序之外 。