webuploader批量导入文件

第一步:

引入文件

<!--引入CSS-->
<link href="~/Content/JS/webuploader.css" rel="stylesheet" />
<!--引入JS-->
<script src="~/Content/JS/webuploader.js"></script>

第二步:

/

/文本多个上传
function UploadMultiFile() {
var uploader = WebUploader.create({
// 选完文件后,是否自动上传。
auto: true,
// swf文件路径
swf: '~/Content/JS/Uploader.swf',
// 文件接收服务端。
server: '/Import/AllUpload',
// 选择文件的按钮。可选。
// 内部根据当前运行是创建,可能是input元素,也可能是flash.
pick: '#picker',
// 不压缩image, 默认如果是jpeg,文件上传前会压缩一把再上传!
resize: false,
fileVal:'fileData'
});
// 当有文件被添加进队列的时候
uploader.on('fileQueued', function (file) {
var itemTemplate = "";
var fileSize = parseInt(file.size / 1024);
if (fileSize >= 1024)
fileSize = parseInt(fileSize / 1024) + "MB"
else
fileSize = parseInt(fileSize) + "KB"

itemTemplate = '<div id="' + file.id + '" class="uploadify-queue-item">\
<div style="width:50px;margin-right:2px;"><img src="/Content/Img/word.png" style="width:20px;height:20px;"></div>\
<div class="cancel">\
<a href=""></a>\
</div>\
<span class="fileName">'+ file.name + ' (' + fileSize + ')</span><span class="data"></span>\
</div>'+ itemTemplate;
$(".border").prepend(itemTemplate);
$(".drag-tip").remove();
});
// 文件上传过程中创建进度条实时显示。
uploader.on('uploadProgress', function (file, percentage) {
var $li = $('#' + file.id),
$percent = $li.find('.uploadify-progress .uploadify-progress-bar');

// 避免重复创建
if (!$percent.length) {
$percent = $('<div class="uploadify-progress uploadify-progress-striped active">' +
'<div class="uploadify-progress-bar" role="progressbar" style="width: 0%">' +
'</div>' +
'</div>').appendTo($li).find('.uploadify-progress-bar');
}
$li.find('.data').text(' 上传中').css("color", "red");;
$percent.css('width', percentage * 100 + '%');
});
//文件成功、失败处理
uploader.on('uploadSuccess', function (file) {
$('#' + file.id).find('.data').text(' 上传成功').css("color", "green");
});

uploader.on('uploadError', function (file) {
$('#' + file.id).find('.data').text(' 上传出错');
});

uploader.on('uploadComplete', function (file) {
$('#' + file.id).find('.uploadify-progress').fadeOut();
});
}

 

第三步:

html标签

<div style="height: 38px;">
<div id="uploader" class="wu-example">
<!--用来存放文件信息-->
<div id="fileList" class="uploader-list"></div>
<div class="btns">
<div id="picker">标准文本批量导入(选择文件)</div>
</div>
</div>
</div>
<div class="border" style="height: 200px; border-radius: 5px;overflow-y:scroll">
</div>

第四步:

后台代码

 1         [AcceptVerbs(HttpVerbs.Post)]
 2         public JsonResult AllUpload(HttpPostedFileBase fileData)
 3         {
 4             if (fileData != null)
 5             {
 6                 try
 7                 {
 8                     //string H = "";
 9                     string filePath = Common.Url;
10                     if (fileData != null && fileData.ContentLength > 0)
11                     {
12                         string fileName = Path.GetFileName(fileData.FileName);//原始文件名称
13                         string fileExtension = Path.GetExtension(fileName); // 文件扩展名
14 
15                         string aFirstName = fileName.Substring(fileName.LastIndexOf("\\") + 1, (fileName.LastIndexOf(".") - fileName.LastIndexOf("\\") - 1));  //文件名
16                         string StdNo = "";
17                         if (aFirstName.Contains("%"))
18                             StdNo = aFirstName.Split('%')[0].Replace("_", "/");
19                         else
20                             StdNo = aFirstName.Replace("_", "/");
21                         var S = db.Standards.FirstOrDefault(n => n.StdNo == StdNo);
22                         if (S != null)
23                         {
24                             string fileName1 = DateTime.Now.ToString("yyyyMMddHHmmss") + Common.NO(S.StdNo) + Path.GetExtension(fileData.FileName);
25                             filePath = filePath + Common.NO(fileName1);
26                             if (System.IO.File.Exists(S.Url))
27                                 System.IO.File.Delete(S.Url);
28                             fileData.SaveAs(filePath);  
29                         }
30                     }
31 
32                     return Json(new { Success = true, FileName = Path.GetFileName(fileData.FileName), SaveName = Path.GetFileName(fileData.FileName) });
33                 }
34                 catch (Exception ex)
35                 {
36                     return Json(new { Success = false, Message = ex.Message }, JsonRequestBehavior.AllowGet);
37                 }
38             }
39             else
40             {
41                 return Json(new { Success = false, Message = "请选择要上传的文件!" }, JsonRequestBehavior.AllowGet);
42             }
43         }

 

posted @ 2021-03-01 15:49  已认证-好姑娘  阅读(175)  评论(0编辑  收藏  举报