这次来看下一个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文件上传的更多相关文章

  1. MVC文件上传-使用jQuery.FileUpload和Backload组件实现文件上传

    本篇使用客户端jQuery-File-Upload插件和服务端Badkload组件实现多文件异步上传.MVC文件上传相关兄弟篇: 处理文件上传的服务端组件Backload 用于处理文件上传的服务端组件 ...

  2. ASP.NET MVC 文件上传和路径处理

    ASP.NET MVC 文件上传和路径处理总结 目录 文件的上传和路径处理必须解决下面列出的实际问题: 1.重复文件处理 2.单独文件上传 3.编辑器中文件上传 4.处理文章中的图片路径 5.处理上传 ...

  3. MVC文件上传与下载

    MVC文件上传与下载 MVC文件上传与下载 想想自己从毕业到工作也有一年多,以前公司的任务的比较重,项目中有的时候需要用到什么东西都去搜索一下,基础知识感觉还没有以前在学校中的好.最近开始写博客,真的 ...

  4. Spring MVC 笔记 —— Spring MVC 文件上传

    文件上传 配置MultipartResolver <bean id="multipartResolver" class="org.springframework.w ...

  5. MVC文件上传09-使用客户端jQuery-File-Upload插件和服务端Backload组件让每个用户有专属文件夹,并在其中创建分类子文件夹

    为用户创建专属上传文件夹后,如果想在其中再创建分类子文件夹,该怎么做?可以在提交文件的视图中再添加一个隐藏域,并设置 name="uploadContext". 相关兄弟篇: MV ...

  6. MVC文件上传08-使用客户端jQuery-File-Upload插件和服务端Backload组件让每个用户有专属文件夹

    当需要为每个用户建立一个专属上传文件夹的时候,可以在提交文件的视图中添加一个隐藏域,并设置name="objectContext". 相关兄弟篇: MVC文件上传01-使用jque ...

  7. MVC文件上传07-使用客户端jQuery-File-Upload插件和服务端Backload组件裁剪上传图片

    本篇通过在配置文件中设置,对上传图片修剪后保存到指定文件夹. 相关兄弟篇: MVC文件上传01-使用jquery异步上传并客户端验证类型和大小  MVC文件上传02-使用HttpPostedFileB ...

  8. MVC文件上传06-使用客户端jQuery-File-Upload插件和服务端Backload组件自定义控制器上传多个文件

    当需要在控制器中处理除了文件的其他表单字段,执行控制器独有的业务逻辑......等等,这时候我们可以自定义控制器. MVC文件上传相关兄弟篇: MVC文件上传01-使用jquery异步上传并客户端验证 ...

  9. MVC文件上传05-使用客户端jQuery-File-Upload插件和服务端Backload组件自定义上传文件夹

    在零配置情况下,文件的上传文件夹是根目录下的Files文件夹,如何自定义文件的上传文件夹呢? MVC文件上传相关兄弟篇: MVC文件上传01-使用jquery异步上传并客户端验证类型和大小  MVC文 ...

  10. MVC文件上传04-使用客户端jQuery-File-Upload插件和服务端Backload组件实现多文件异步上传

    本篇使用客户端jQuery-File-Upload插件和服务端Badkload组件实现多文件异步上传.MVC文件上传相关兄弟篇: MVC文件上传01-使用jquery异步上传并客户端验证类型和大小  ...

随机推荐

  1. linux下安装shellinabox实现web登录服务器

    GitHub地址(含有文件下载和详细安装流程):https://github.com/shellinabox/shellinabox 这里我们使用的是redhat安装方法如下: 1.配置安装依赖环境 ...

  2. linux split 切割大文件

    语法: split  [-l <行数>] [-b <字节>] [-C <字节>] [要切割的目标文件] [输出文件名前缀] 说明: -l <行数> 指定 ...

  3. Linux系统自动备份的Shell

    公司现在需要对现有的服务器进行定期备份,并将备份文件放置到正在使用的NAS中去: 为了备份的效率,还需要对备份的文件进行筛选,排除一些后缀名的文件: 实现方法如下: 1. 编写备份的shell文件 在 ...

  4. LintCode 58: Compare Strings

    LintCode 58: Compare Strings 题目描述 比较两个字符串A和B,确定A中是否包含B中所有的字符.字符串A和B中的字符都是大写字母. 样例 给出A = "ABCD&q ...

  5. 20155235 2016-2017-2 《Java程序设计》第六周学习总结

    20155235 2016-2017-2 <Java程序设计>第六周学习总结 教材学习内容总结 第十章 InputStream与OutputStreaam 串流设计的概念 串流继承架构 川 ...

  6. ConcrrentSkipListMap介绍和原理分析

    一.前言: JDK为我们提供了很多Map接口的实现,使得我们可以方便地处理Key-Value的数据结构. 当我们希望快速存取<Key, Value>键值对时我们可以使用HashMap. 当 ...

  7. 【leetcode 简单】 第六十七题 回文链表

    请判断一个链表是否为回文链表. 示例 1: 输入: 1->2 输出: false 示例 2: 输入: 1->2->2->1 输出: true 进阶: 你能否用 O(n) 时间复 ...

  8. Python——脚本(calculator)

    <Python基础教程>(第二版) P123 书中原代码如下: class Calculator: def calculator(self,expression): self.value ...

  9. MySQL 执行SQL脚本 报ERROR 1231 (42000)的解决办法【转】

    今天在source mysqldump 备份文件时,发现导入的过程中报如下的错误: ERROR 1231 (42000): Variable 'time_zone' can't be set to t ...

  10. 最详细的block底层

    主要讲述的要点: block 干什么用的 block 语法 block 底层实现 block 变量捕捉 block 的种类.在存储空间中的存储位置 block 循环引用 __block 在ARC 中 ...