C# MVC4环境下Uploadify 3.2.1上传文件

1.新建一个空的MVC4项目

C# MVC4环境下Uploadify 3.2.1上传文件_第1张图片


2.添加一个Home控制器,并在Home控制器下添加一个Index视图

C# MVC4环境下Uploadify 3.2.1上传文件_第2张图片


3.下载Flash版的uploadify,链接:Uploadify下载地址

4.解压压缩包,得到下列文件

C# MVC4环境下Uploadify 3.2.1上传文件_第3张图片 

5.单击项目UploadifyDemo,右键添加新建文件夹Uploadify,并将加压得到的:uploadify.css,jquery.uploadify.min.js,uploadify.swf,uploadify-cancel.png添加到文件夹Uploadify下,并从别处将jquery-1.8.2.min.js拷贝到该文件夹下

C# MVC4环境下Uploadify 3.2.1上传文件_第4张图片


6.编辑Index视图


    Uploadify Demo
    
    
    

    


    
    
C# MVC4环境下Uploadify 3.2.1上传文件_第5张图片


7.因为取消上传的图标默认是放在img文件夹下,按照我们项目的做法,需修改为Uploadify文件夹下

   故将uploadify.css第74行代码修改为:

.uploadify-queue-item .cancel a {
	background: url('uploadify-cancel.png') 0 0 no-repeat;
	float: right;
	height:	16px;
	text-indent: -9999px;
	width: 16px;
}
C# MVC4环境下Uploadify 3.2.1上传文件_第6张图片


8.在Home控制器中添加文件上传处理方法

        public ActionResult UploadifyFun(HttpPostedFileBase Filedata)
        {
            if (Filedata == null ||
                String.IsNullOrEmpty(Filedata.FileName) ||
                Filedata.ContentLength == 0)
            {
                return this.HttpNotFound();
            }

            string filename = System.IO.Path.GetFileName(Filedata.FileName);
            string virtualPath = String.Format("~/UploadFile/{0}", filename);

            string path = this.Server.MapPath(virtualPath);
            Filedata.SaveAs(path);
            return this.Json(new object { });
        }
C# MVC4环境下Uploadify 3.2.1上传文件_第7张图片

9.在根目录下新建文件夹UploadFile用于存放上传文件


至此:Uploadify上传文件的准备工作已经做完,下面测试

1.运行

C# MVC4环境下Uploadify 3.2.1上传文件_第8张图片


2.选择需要上传的文件

C# MVC4环境下Uploadify 3.2.1上传文件_第9张图片


3.上传

C# MVC4环境下Uploadify 3.2.1上传文件_第10张图片

C# MVC4环境下Uploadify 3.2.1上传文件_第11张图片


4.文件上传成功


这样,一个简单的Uploadify上传文件的例子就做完了,当然这只是一个很简单的实例,后面还需要继续深化


你可能感兴趣的:(C#)