1.說明
項目中使用form表單配合ajax同時提交文件和其他的參數,具體實現請看代碼
2.前端代碼
- form表單部分
前台提交的是方式是form表單方式,提交內容包括普通的參數和文件
<form action="" class="form-horizontal " id="equipmentTypeform" enctype=」 multipart/form-data」/>
<input type="text" class="form-control" id="manufacturer" name="manufacturer">
<input type="text" class="form-control" maxlength="20" id="equipmentTypeNm" name="equipmentTypeNm" placeholder="請輸入設備類別名稱">
<a href="javascript:fileChange();" data-item="import" class="btn btn-primary btn-xs m-5"><i class="fa fa-eye"></i>導入</a><span id="importName"></span>
<input type="file" id="fielUpload" name="file" style="display: none" onchange="importDfFile()" />
</from>2.ajax
var formData = new FormData(); //需要用到formData
formData.append('file',$("#fielUpload")[0].files[0]); //添加選擇的文件 key值為file
//把from表單的參數序列化 轉換成json key值為 equipmentTypeForm
formData.append('equipmentTypeForm',JSON.stringify($('#equipmentTypeform').serializeObject()))
$.ajax({
type : "post",
url : "aaa.ajax",//自己的介面地址
data :formData,
dataType : "json",
cache: false,
async:false,
processData: false,
contentType: false,//必須添加
success : function(data) {
if(data.success){
//成功之後執行的代碼
}else{
//失敗之後的代碼
}
}
});3.後端代碼
@ResponseBody
@RequestMapping(value = "/aaa.ajax",method = RequestMethod.POST)
public String save(@RequestParam(value="file") MultipartFile file,HttpServletRequest reuqest) {
//拿到json 轉換成我們需要的對象
EquipmentTypeForm equipmentTypeForm = JSONObject.parseObject(reuqest.getParameter("equipmentTypeForm"), EquipmentTypeForm.class);
System.out.println();
System.out.println(file);
}原創文章,作者:投稿專員,如若轉載,請註明出處:https://www.506064.com/zh-tw/n/234486.html
微信掃一掃
支付寶掃一掃