HTML:
<div class="row">
<div class="col-lg-12 col-md-5 col-xs-12">
<form id="formFile" class="form-horizontal" action="upload/insert" method="post" enctype="multipart/form-data">
<input type="hidden" id="comCode" name="comCode">
<div class="row form-group">
<div class="col-xs-1 text-right padding-0">
<label for="" class="control-label"><font color="#FF0000" size="+1" style="vertical-align: middle">*</font>文件名:</label>
</div>
<div class="col-xs-12 padding-1">
<input type="file" id="fileId" name="file" multiple data-show-caption="true" />
</div>
</div>
</form>
</div>
</div>
JS:
initFileInput:function(){
$("#fileId").fileinput({
language: 'zh', //设置语言
allowedFileExtensions: ["xlsx","xls"],//接收的文件后缀
showUpload: false, //是否显示上传按钮
showRemove: true, //显示移除按钮
showPreview: true, //是否显示预览
showCaption: true,//是否显示标题
browseClass: "btn btn-primary", //按钮样式
maxFileCount: 10, //表示允许同时上传的最大文件个数
maxFileSize: 2000,
enctype: 'multipart/form-data',
autoReplace:true,//替换当前文件
previewFileIcon: '<i class="fa fa-file-excel-o text-success"></i>',
msgFilesTooMany: "选择上传的文件数量({n}) 超过允许的最大数值{m}!"
}).on("fileuploaded", function (event, data, previewId, index) {
var data = data.response.lstOrderImport;
if (data == undefined) {
toastr.error('文件格式类型不正确');
return;
}
});
},
Ajax:
let data = new FormData();
data.append("comCode", comCode);
$.each($("#fileId")[0].files, function (i, file) {
data.append(file.name, file);
});
$.ajax({
url: 'api/xxx/xxx',
data: data,
cache: false,
contentType: false,
processData: false,
type: 'POST',
success: function(data){
},
error:function(XMLHttpRequest, textStatus, errorThrown){
},
beforeSend: function(request) {
},
});
JAVA:
@PostMapping("/xxxx")
public ApiResponse<String> xxxx(HttpServletRequest request){
String comCode = request.getParameter("comCode");
MultipartHttpServletRequest multipartRequest = WebUtils.getNativeRequest(request, MultipartHttpServletRequest.class);
// 获取文件map集合
Map<String, MultipartFile> fileMap = multipartRequest.getFileMap();
return ApiResponse.ok("成功");
}