使用Ajax手動提交表單

我想調用表單提交使用Ajax的servlet。但它不會觸及ajax和頁面重新加載。我觸發表單手動提交，然後在那個提交函數，我打電話給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>

來源

2016-01-07 Deve1

我假設你想用'POST'來提交表單。另外，你傳遞'e'作爲'event'參數 - 但是然後嘗試使用'event.preventDefault（）' - 應該是'e.preventDefault（）' – tymeJV

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

目前，您正嘗試在手動觸發提交後將其綁定......這已經太遲了，因爲事件已經過去了。

移動綁定submit事件以外的代碼change事件的事件處理程序。

來源

2016-01-07 15:33:06 Quentin

使用Ajax手動提交表單

回答

相關問題