首页 > 代码库 > MVC 上传文件+预览

MVC 上传文件+预览

学习记录    复习用

一、调用了Uploadify插件

Uploadify是JQuery的一个上传插件,实现的效果非常不错,带进度显示。(具体参数百度就是。)

二、上传文件的方法

namespace PM.Myjobweb.Controllers{    public class FileOperationsController : Controller    {        BLL.pc_attachment bll_attachment = new BLL.pc_attachment();        //        // GET: /FileOperations/        /// <summary>        /// 上传文件        /// </summary>        /// <param name="fileData"></param>        /// <returns></returns>        [AcceptVerbs(HttpVerbs.Post)]        public ActionResult Upload(HttpPostedFileBase fileData)        {            if (fileData != null)            {                try                {                    // 文件上传后的保存路径                    string filePath = Server.MapPath(Request["folder"] + "\\");                    if (!Directory.Exists(filePath))                    {                        Directory.CreateDirectory(filePath);                    }                    string fileName = Path.GetFileName(fileData.FileName);// 原始文件名称                    string fileExtension = Path.GetExtension(fileName); // 文件扩展名                    string saveName = Guid.NewGuid().ToString() + fileExtension; // 保存文件名称                    string url = "/Content/JqueryUpload/upload/" + saveName;                    fileData.SaveAs(filePath + saveName);                    if (fileExtension == ".docx" || fileExtension == ".doc" || fileExtension == ".pdf" || fileExtension == ".xlsx")                        url = "/Content/JqueryUpload/html/" + PM.Common.FilesToHtml.FileToHtml(filePath + saveName, TimeParser.ConvertDateTimeInt(DateTime.Now).ToString(), fileExtension.Substring(1));                    FilesModel m_files = new FilesModel();                    m_files.DesName = fileName;                    m_files.FileExtension = fileExtension;                    m_files.SaveName = saveName;                    m_files.Att_Expansion2 = url;                    Model.pc_attachment m_attachment = new Model.pc_attachment();                    m_attachment.Att_Name = fileName;                    m_attachment.Att_Type = fileExtension;                    m_attachment.Att_Url = saveName;                    m_attachment.Att_Expansion1 = DateTime.Now.ToString();                    m_attachment.Att_Expansion2 = url;                    int resultId = bll_attachment.Add(m_attachment);                    if (resultId > 0)                    {                        m_files.ResultId = resultId;                        return Json(new { code = 0, msg = m_files });                    }                    else                    {                        return Json(new { code = -1, msg = m_files });                    }                }                catch (Exception ex)                {                    return Json(new { code = -1, Message = ex.Message }, JsonRequestBehavior.AllowGet);                }            }            else            {                return Json(new { code = false, Message = "请选择要上传的文件!" }, JsonRequestBehavior.AllowGet);            }        }    }    public class FilesModel    {        public int ResultId { get; set; }        public string FileExtension { get; set; }        public string SaveName { get; set; }        public string DesName { get; set; }        public string Att_Expansion2 { get; set; }    }}
上传文件的方法

三、JS

<script type="text/javascript">    $(document).ready(function () {        $("#uploadify").uploadify({            uploader: /Content/JqueryUpload/js/uploadify.swf,            script: /FileOperations/Upload,            cancelImg: /Content/JqueryUpload/js/cancel.png,            buttonText: upload,            folder: /Content/JqueryUpload/upload,            queueID: fileQueue,//            ‘hideButton‘:true,            multi: true,            auto: true,            //‘wmode‘: ‘transparent‘,            onComplete: function (event, queueId, fileObj, response, data) {                var obj = eval("(" + response + ")");                var oldName = ‘‘;                var newName = ‘‘;                var fileType = ‘‘;                var Att_Expansion2 = ‘‘;                var id = ‘‘;                switch (obj.msg.FileExtension) {                    case .docx:                        fileType = icon-word;                        break;                    case .doc:                        fileType = icon-word;                        break;                    case .pdf:                        fileType = icon-pdf;                        break;                    case .xlsx:                        fileType = icon-excel;                        break;                    case .jpg:                        fileType = icon-tupian;                        break;                    case .ppt:                        fileType = icon-ppt;                        break;                    case .txt:                        fileType = icon-txt;                        break;                }                oldName = obj.msg.DesName;                newName = obj.msg.SaveName;                id = obj.msg.ResultId;                Att_Expansion2 = obj.msg.Att_Expansion2;                var liobj = <li id="add" tag=" + id + "><i class="icon-word"></i>" + oldName + "<a target="_blank" href=http://www.mamicode.com/ + Att_Expansion2 + >预览</a><a href="http://www.mamicode.com/Content/JqueryUpload/upload/ + newName + ">下载</a></li>;                $(liobj).appendTo($(.annex-list));            }        });    });
JS

四、调用

<label>附件</label>            <ul class="annex-list">                <li>                     <input type="file" name="uploadify" id="uploadify" style=" visibility:hidden" /><div id="fileQueue">                    </div>                </li>            </ul>
调用

 

MVC 上传文件+预览