这里就简单介绍下ajaxFileUpload,jQuery插件AjaxFileUpload可以实现ajax文件上传。我们的项目采用的是jsp跟js分离的架构,所以代码如下。
首先是jsp部分:
这里说下 为什么把form注释了,因为我的jsp中已经有了另外一个form 在调试过程中发现可能有冲突就把form注释了,事实证明ajaxFileUpload 不用form表单一样可以提交,下面就是js代码部分:
文件选择器
$("#upload1").on('click',function() {
//选择文件之后执行上传
$.ajaxFileUpload({
url:'supplyDataReportUploadExcel',//url自己写
secureuri:false,//这个是啥没啥用
type:'post',fileElementId:'fileToUpload',//file<a href="https://www.jb51.cc/tag/biaoqian/" target="_blank" class="keywords">标签</a>的id
dataType: 'json',//返回数据的类型
//data:{name:'logan'},//一同<a href="https://www.jb51.cc/tag/shangchuan/" target="_blank" class="keywords">上传</a>的数据
success: function (data,status) {
// alert(data);
// alert(data.msg);
// alert(data.success);
if(data.success){
alert("upload,success!!!");
window.location.href='supplyDataReport';
}else{
alert(data.msg);
window.location.href='supplyDataReport';
}
}/*,error: function (data,status,e) {
alert(e);
}*/
});
});
});
本人js不好,只是会用这个js不能完全copy走,要结合项目结构的实际情况,不过大体参数干什么的注释都写了。一定注意type是post跟请求对应的Controller的方法的method=RequestMethod.POST 一致。注意dataType:'json',一定注意json的大小写。
ps:这里要说一下我用的data.success做的判断跟后面的一个实体类AjaxJson有关系,注意!!!!!
对了 jsp中还需要引入 对应的js如下: