<form id="uploadForm" method="post" enctype="multipart/form-data">
<input type="file" id="uploadfiles" name="file" multiple="multiple" style="display:none" accept="aplication/zip">
</form> <!-- 导入文件滚动条窗口 -->
<div class="modal fade" id="progressbar" tabindex="-1" role="dialog" aria-labelledby="" aria-hidden="true" data-backdrop="false" data-keyboard="false">
<div class="modal-dialog modal-dialog-centered ">
<div class="modal-content" style="padding-top:10px;">
<div class="modal-body" style="color:black;">
上传进度：<progress style="width:30em;"></progress>
<p id="info" style="margin-top:10px"></p> </div> </div>
</div>
</div>
<div class="btn-group">
<a class="btn btn-primary dropdown-text" authorize="yes" onclick="$('#uploadfiles').click()" id="Import" title="可以选择多个文件同时上传"><i class="fa fa-plus"></i>批量上传</a>
</div>
js
var totalSize = 0;
//绑定所有type=file的元素的onchange事件的处理函数
$('#uploadfiles').change(function eventStart() {
var fileQty = this.files.length;
if (fileQty == 0) {
return;
}
else {
var unvalidFiles = [];
$(this.files).each(
function (index, file) {
var filename = file.name;
//type = file.type; ini文件获取扩展名为空
var extIndex = filename.lastIndexOf(".");
var ext = filename.substring(extIndex + 1);//扩缀名
if (ext != 'zip') {
unvalidFiles.push(filename);
}
var size = file.size;
totalSize += size;
});
if (unvalidFiles.length > 0) {
$('#uploadfiles').val("");
$.modalAlert('存在非zip文件，请重新选择', 'error');
return;
}
else {
$("#info").html("已上传/总大小： " + '0KB/' + Math.ceil(totalSize / 1000) + "KB");
$("#progressbar").modal(); doUpload("/NGS/Report/Upload");
} } }); //上传文件
function doUpload(url) {
//创建FormData对象，初始化为form表单中的数据。需要添加其他数据可使用formData.append("property", "value");
var formData = new FormData($('form')[0]);
//formData.append("DataType", DataType);
//ajax异步上传
$.ajax({
url: url,//"/NGS/Report/Upload",
type: "POST",
cache: false,
data: formData,
dataType: 'json',
contentType: false, //必须false才会自动加上正确的Content-Type
processData: false, //必须false才会避开jQuery对 formdata 的默认处理
xhr: function () { //获取ajaxSettings中的xhr对象，为它的upload属性绑定progress事件的处理函数
myXhr = $.ajaxSettings.xhr();
if (myXhr.upload) { //检查upload属性是否存在
//绑定progress事件的回调函数
myXhr.upload.addEventListener('progress', progressHandlingFunction, false);
}
return myXhr; //xhr对象返回给jQuery使用
},
success: function (result, status, xhr) {
$("#progressbar").hide();
$('#uploadfiles').val("");
$("#progressbar").modal('hide');
if (result.state == "error") {
console.log(result1);
var err = '<textarea style="width:430px;height:294px;outline:none;resize:none;">有部分文件导入失败，请检查原因：\r\n';
$.each(result.data, function (index, item) { // err += index + 1 + '、文件名：' + item.file + ' 错误：' + item.error + '\r\n';
err += index + 1 + '、文件名：' + item + '\r\n'; }); content = err + '</textarea>';
top.layer.alert(content, {
icon: 'fa-times-circle',
title: "系统提示",
area: ['550px', '450px'],
btn: ['确认'],
btnclass: ['btn btn-primary']
});
}
else {
$.currentWindow().$("#gridList").trigger("reloadGrid");
$.modalMsg('上传文件成功', 'success');
$('#loadingPage', parent.document).css("display", "none");
} },
error: function (XMLHttpRequest, textStatus, error) {
$('#uploadfiles').val("");
$("#progressbar").modal('hide');
$.modalMsg(error, 'error');//报错：
},
});
} //上传进度回调函数：
function progressHandlingFunction(e) {
total = Math.ceil(e.total / 1000);
if (e.lengthComputable) {
loaded = Math.ceil(e.loaded / 1000);
$('progress').attr({ value: loaded, max: total }); //更新数据到进度条
var percent = loaded / total * 100;
$('#info').html(loaded + "/" + total + " KB " + "<span>" + percent.toFixed(2)+"</span>" + "%");
}
var infoV = $("#info span").html();
if (infoV == 100.00) {
$("#progressbar").hide();
$('#loadingPage', parent.document).css("display", "block");
$('#loadingPage .loading-content', parent.document).html("数据处理中，请稍后…"); } }