MVC文件上传
这次来看下一个MVC网站上传文件的功能,其中上传用到uploadify这个jquery插件,网上还有很多类似的,哪种都无所谓,能实现功能便行,貌似uploadify官网上的这个插件是要付费的,这里就顺便提供这个插件的下载地址如下:http://files.cnblogs.com/xmfdsh/uploadify3.2.zip
首先创建一个MVC的网站,新建一个文件夹名称为UpLoadiFy(这里可以随便起名称),来存放uploadify这个插件需要用到的js,css以及flash文件。如下图:

Home控制器有两个方法,Index和一个上传时插件传入的UpLoadFile方法。如下:
public ActionResult Index()
{
return View();
} [HttpPost]
public ContentResult UpLoadFile(HttpPostedFileBase fileData)
{
if (fileData != null && fileData.ContentLength > )
{
string fileSave = Server.MapPath("~/UpLoad/");
//获取文件的扩展名
string extName = Path.GetExtension(fileData.FileName);
//得到一个新的文件名称
string newName = Guid.NewGuid().ToString() + extName;
fileData.SaveAs(Path.Combine(fileSave, newName));
}
return Content("");
}
至于前台的话就只需要引用jquery的js和对应插件的js,css,便可。:

至于<script></script>里面的代码就如下了,通过初始化来实现上传功能,至于里面的参数可以去google一下uploadify这个插件的相关参数,下面的代码也注释了一下主要参数的作用。
<script type="text/javascript">
$(function () {
$('#Filedata').uploadify({
fileObjName: 'Filedata',
uploader: '/Home/UpLoadFile', // 服务器端处理地址
swf: '/UpLoadiFy/uploadify.swf', // 上传使用的 Flash
width: 60, // 按钮的宽度
height: 23, // 按钮的高度
buttonText: "上传", // 按钮上的文字
buttonCursor: 'hand', // 按钮的鼠标图标
fileObjName: 'Filedata', // 上传参数名称
// 两个配套使用
fileTypeExts: "*.jpg;*.png", // 扩展名,限制扩展名,可按照自己想要的来设置
fileTypeDesc: "请选择 jpg png 文件", // 文件说明
auto: true, // 选择之后,自动开始上传
multi: true, // 是否支持同时上传多个文件
queueSizeLimit: 5 // 允许多文件上传的时候,同时上传文件的个数
});
});
</script>
这样便搞定了整个基本上传的功能,从前台的jquery插件选择了文件后,便会把这个文件的相关信息传入都控制器后台的UpLoadFile方法,然后再保存起来到指定的路径,如上面的代码我保存的是("~/UpLoad/");这个路径。运行效果如下:


MVC文件上传的更多相关文章
- MVC文件上传-使用jQuery.FileUpload和Backload组件实现文件上传
本篇使用客户端jQuery-File-Upload插件和服务端Badkload组件实现多文件异步上传.MVC文件上传相关兄弟篇: 处理文件上传的服务端组件Backload 用于处理文件上传的服务端组件 ...
- ASP.NET MVC 文件上传和路径处理
ASP.NET MVC 文件上传和路径处理总结 目录 文件的上传和路径处理必须解决下面列出的实际问题: 1.重复文件处理 2.单独文件上传 3.编辑器中文件上传 4.处理文章中的图片路径 5.处理上传 ...
- MVC文件上传与下载
MVC文件上传与下载 MVC文件上传与下载 想想自己从毕业到工作也有一年多,以前公司的任务的比较重,项目中有的时候需要用到什么东西都去搜索一下,基础知识感觉还没有以前在学校中的好.最近开始写博客,真的 ...
- Spring MVC 笔记 —— Spring MVC 文件上传
文件上传 配置MultipartResolver <bean id="multipartResolver" class="org.springframework.w ...
- MVC文件上传09-使用客户端jQuery-File-Upload插件和服务端Backload组件让每个用户有专属文件夹,并在其中创建分类子文件夹
为用户创建专属上传文件夹后,如果想在其中再创建分类子文件夹,该怎么做?可以在提交文件的视图中再添加一个隐藏域,并设置 name="uploadContext". 相关兄弟篇: MV ...
- MVC文件上传08-使用客户端jQuery-File-Upload插件和服务端Backload组件让每个用户有专属文件夹
当需要为每个用户建立一个专属上传文件夹的时候,可以在提交文件的视图中添加一个隐藏域,并设置name="objectContext". 相关兄弟篇: MVC文件上传01-使用jque ...
- MVC文件上传07-使用客户端jQuery-File-Upload插件和服务端Backload组件裁剪上传图片
本篇通过在配置文件中设置,对上传图片修剪后保存到指定文件夹. 相关兄弟篇: MVC文件上传01-使用jquery异步上传并客户端验证类型和大小 MVC文件上传02-使用HttpPostedFileB ...
- MVC文件上传06-使用客户端jQuery-File-Upload插件和服务端Backload组件自定义控制器上传多个文件
当需要在控制器中处理除了文件的其他表单字段,执行控制器独有的业务逻辑......等等,这时候我们可以自定义控制器. MVC文件上传相关兄弟篇: MVC文件上传01-使用jquery异步上传并客户端验证 ...
- MVC文件上传05-使用客户端jQuery-File-Upload插件和服务端Backload组件自定义上传文件夹
在零配置情况下,文件的上传文件夹是根目录下的Files文件夹,如何自定义文件的上传文件夹呢? MVC文件上传相关兄弟篇: MVC文件上传01-使用jquery异步上传并客户端验证类型和大小 MVC文 ...
- MVC文件上传04-使用客户端jQuery-File-Upload插件和服务端Backload组件实现多文件异步上传
本篇使用客户端jQuery-File-Upload插件和服务端Badkload组件实现多文件异步上传.MVC文件上传相关兄弟篇: MVC文件上传01-使用jquery异步上传并客户端验证类型和大小 ...
随机推荐
- Java 9 新特性快速预览
原文出处:wangwenjun69 Java 8 已经出来三年多的时间了,原本计划2016年七月份release Java 9,但是基于种种原因,Java 9 被推迟到了2017年的3月份,本人也在O ...
- uboot常用命令详解
dnw:在进入系统之前进入指令行,输入该指令可下载烧录文件. re:重新启动嵌入式系统. printenv:打印当前系统环境变量. setenv:设置环境变量,格式:setenv name value ...
- git 提交模板配置
1.创建模板文件,比如gitTemplate.txt,内容如下: ABSTRACT:修改自测发现的多度数据同步相关问题. Bug Fix [Y/N]:NBug ID:New Feature [Y/N] ...
- 为了拿Ph.D而做出的诺贝尔奖
- Metrics.Net实践(2)在WEB中应用度量
Gauges 可以画出Http Request执行时间的波形图: actionInfo表示MVC中的Action,即按照action类型来分组 Metric.Context(this.actionIn ...
- R5—字符串处理/正则表达式
R通常被用来进行数值计算比较多,字符串处理相对较少,而且关于字符串的函数也不多,用得多的就是substr.strsplit.paste.regexpr这几个了.实际上R关于字符串处理的功能是非常强大的 ...
- R爬虫实战1(学习)—基于RVEST包
这里用Hadley Wickham开发的rvest包.再次给这位矜矜业业开发各种好用的R包的大神奉上膝盖. 查阅资料如下: rvest的github rvest自身的帮助文档 rvest + CSS ...
- cmmusic:小巧而实用的mplayer音乐播放前端
Author: Jiqing (jiqingwu@gmail.com) home: http://hi.baidu.com/jiqing0925 create: 2011-03-10 update: ...
- 在Linode VPS上搭建最新版Transmission
在Linode VPS上搭建最新版Transmission 2015-09-16 by Hansen 原文链接:http://www.hansendong.me/archives/124.html 以 ...
- Linux堆内存管理深入分析 (上半部)【转】
转自:http://www.cnblogs.com/alisecurity/p/5486458.html Linux堆内存管理深入分析(上半部) 作者:走位@阿里聚安全 0 前言 近年来,漏洞挖掘越来 ...