使用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手动提交表单

回答

相关问题