I had a problem with ajax submission form before. I used FormData, but the submission would go directly to the error method block. After listening to what my previous classmates said, I changed <button> to <input type="button"/ > I got the solution, but I can’t figure it out. I hope someone can help me figure it out (no matter I use <button> or <input type="button"/>, the background can run normally and return. The difference is , if you use <button>, you will directly enter the error block when receiving data in the background, but if you use <input type="button"/>, there will be no problem), the code is posted below
form form
<form id="upForm" method="post" basePath=<%=basePath %> enctype="multipart/form-data">
<table id="uptable">
<tr>
<td><span class="required">*</span> 终端类型</td>
<td><select id="terminalType" name="terminalType">
<option value="PC">PC</option>
<option value="ANDROID">Android</option>
</select></td>
<td></td>
</tr>
<tr>
<td><span class="required">*</span> 上传安装包</td>
<td><input id="upfile" type="file" name="upfile"/> 必须上传软件安装包</td>
</tr>
<tr>
<td><span class="required">*</span> 软件类型</td>
<td><input id="appType" type="text" name="appType"/> 必须填写软件类型</td>
</tr>
<tr>
<td> 新版本描述</td>
<td><textarea id="description" rows="6" cols="80" name="description"></textarea></td>
</tr>
<tr>
<!-- action="version/upload" -->
<td align="center" colspan="2"><input type="button" id="submit_btn" value="上传"></td>
</tr>
</table>
</form>
js code
$(function(){
$("#submit_btn").on("click",function(){
submit();
});
});
function submit(){
var formData = new FormData($("#upForm")[0]);
var appType = $("#appType").val();
if(!/[0-9]+/.test(appType)){
alert('appType must be number')
}
$.ajax({
type:'post',
url:$("#upForm").attr('basePath')+'version/upload',
cache:false,
contentType:false,
processData:false,
data:formData,
dataType : 'json',
success:function(callback){
$("#msg_p").text(callback.msg);
$("#msg_p").show();
setTimeout(function(){
$("#msg_p").hide();
if (callback.success == true)
alert(1);
//window.location.href="version/upPage";
else
alert(0);
},500);
},
error:function(){
alert("进入error function");
}
});
The following two tags will automatically submit the form:
<button>
<input type="submit">
The following tags will not automatically submit the form:
<input type="button">
If you use the first two, the browser itself will help you submit once, and your code will be submitted again $("#submit_btn").on("click",function(){
It will be repeated.
Don’t put the
<button>
标签当成<form>
中的input
element.Use button to specify type=button to avoid it