前言

在MVC 中文件的上传,一般都采用控件:

 <h2>IT轮子四——文件上传</h2>
<div>
<input type="file" />
</div>

第一种方式:使用form表单上传

前台代码:

<div>
<form action="/FileUpload/UploadFile" method="post" enctype="multipart/form-data">
<input type="file" name="file" /><br /><br />
<input type="submit" value="提交" />
</form>
</div>

在前台界面,我们需要注意,当采用form提交数据的时候,我们页面中的控件必须要有name属性。否则,后台接收不到数据。

后台代码:

 [HttpPost]
public ActionResult UploadFile() {
try
{
var files = Request.Files;
foreach (string item in files)
{
//可上传多个文件
var file = files[item];
var fileName = file.FileName;
var filePath = Server.MapPath(string.Format("~/{0}", "File"));
//判断路径是否存在
if (!Directory.Exists(filePath))
{
//创建路径
Directory.CreateDirectory(filePath);
}
//保存文件
file.SaveAs(Path.Combine(filePath, fileName));
}
}
catch (Exception ex)
{
throw;
}
return View("Index");
}

好拉,这样就文件就保存到指定的目录拉。

第二种方式:使用Jquery+formdata对象

formdata对象上传文件,其实也上form表单的另一种方式。只是通过juqery进行提交而不是form默认的action。

 <h2 style="color:burlywood">第二种方式:使用Jquery+formdata对象</h2>
<div>
<input type="file" name="file" /><br />
<input type="button" value="提交" id="btnUpload" />
</div>
<script>
$(document).ready(function () {
//给按钮绑定点击事件
$("#btnUpload").on("click", function () {
//声明formdata对象
var formData = new FormData();
//获取上传文件
var files = $("input[name='file']").get().files[];
formData.append("myFile", files);
//这里也可以添加其他参数
formData.append("Name", "Peter");
//通过ajax上传
$.ajax({
url: '/Home/Upload/',
data: formData,
type: 'post',
contentType: false,//这里必须为false
processData: false,//这里必须为false
success: function (obj) {
if (obj.success == ) {
//根据返回json的对象做出提示
alert("上传成功");
}
}
});
})
})
</script>

前端视图

        public ActionResult Upload()
{
//这里的files 和form 都可按第一种上传方式处理、解析上传的文件和数据
var files = Request.Files;
var form = Request.Form;
//do something here //return the josn object
var obj = new
{
success =
};
return Json(obj);
}

后端接收代码

后记

从10月初,确切的说9月29号起,也写了7、8篇技术类文章。有的文章也有几百的阅读量,可评论留言的人却少之又少,点赞、推荐就更没有。如果这些文章确实帮到了你,对你的工作有那么一点点的用,希望路过的兄弟姐妹们可以有赞的点个赞,有推荐的来个推荐,有转载的来个转载,为我这个博客园增添点人气。

谢谢拉

谨以这篇博客鞭策自己。

IT轮子系列(四)——使用Jquery+formdata对象 上传 文件的更多相关文章

  1. 通过jQuery Ajax使用FormData对象上传文件

    FormData对象,是可以使用一系列的键值对来模拟一个完整的表单,然后使用XMLHttpRequest发送这个"表单". 在 Mozilla Developer 网站 使用For ...

  2. 通过jQuery Ajax使用FormData对象上传文件 (转载)

    XMLHttpRequest Level 2 添加了一个新的接口——FormData.与普通的 Ajax 相比,使用 FormData 的最大优点就是我们可以异步上传二进制文件.jQuery 2.0+ ...

  3. [转] 通过jQuery Ajax使用FormData对象上传文件

    FormData对象,是可以使用一系列的键值对来模拟一个完整的表单,然后使用XMLHttpRequest发送这个"表单". 在 Mozilla Developer 网站 使用For ...

  4. HTML5 jQuery+FormData 异步上传文件,带进度条

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <link href ...

  5. 利用formdata对象上传文件时,需要添加的参数

    function doUpload() { var formData = new FormData($( "#uploadForm" )[0]); $.ajax({ url: 'h ...

  6. FormData 对象上传二进制文件

    使用jQuery 利用 FormData 上传文件:http://harttle.com/2016/07/04/jquery-file-upload.html     通过FormData对象可以组装 ...

  7. python中使用multipart/form-data请求上传文件

    最近测试的接口是上传文件的接口,上传单个文件,我主要使用了2种方法~ 接口例如: URL: http://www.baidu.com/*** method:post 参数: { "salar ...

  8. 使用python或robotframework调multipart/form-data接口上传文件

    这几天调一个multipart/form-data类型的接口,遇到点小阻碍.之前同事有使用urllib库写了个类似的方法实现,比较长,想要改的时候发现不太好使.在网上查找发现用requests库做这个 ...

  9. jQuery 关于IE9上传文件无法进入后台问题的原因及解决办法(ajaxfileupload.js第四弹)

    第四弹的诞生完全不在自己最初的计划之中,是有个网友看了先前关于<ajaxfileupload.js系列>的文章后提出的问题,由于自己一直是用chrome浏览器去测试demo,完全忽略IE浏 ...

随机推荐

  1. app如何更换用户头像信息呢?不妨这样做

    对于现在的手机应用而言,要想获得更多的人的使用,就需要给用户更多的自由功能才行,这也是基于用户体验开发软件的核心思想,一切以用户为中心,想用户之所想,做用户之所需.今天我就来谈一谈刚学到的一个关于设置 ...

  2. SSH深度历险(十) AOP原理及相关概念学习+AspectJ注解方式配置spring AOP

    AOP(Aspect Oriented Programming),是面向切面编程的技术.AOP基于IoC基础,是对OOP的有益补充. AOP之所以能得到广泛应用,主要是因为它将应用系统拆分分了2个部分 ...

  3. THE SCHOOLS WHERE APPLE, GOOGLE, AND FACEBOOK GET THEIR RECRUITS

  4. Android简易实战教程--第三话《自己实现打电话》

    需要一个文本输入框输入号码,需要一个按钮打电话.本质:点击按钮,调用系统打电话功能. xml布局文件代码:: <LinearLayout xmlns:android="http://s ...

  5. Tapestry: Obtained resource by @Inject is NULL

    Issue: When you inject some resources by @Inject Annotation in Tapestry Page or other components, yo ...

  6. Mybatis源码之Statement处理器StatementHandler(一)

    StatementHandler通过类名我们可以了解到它可能是Statement的处理器,它是一个接口,其实现类如下: BaseStatementHandler:一个抽象类,只是实现了一些不涉及具体操 ...

  7. MySQL 数据库开发的 36 条军规

    MySQL 数据库开发的 36 条军规 写在前面的话: 总是在灾难发生后,才想起容灾的重要性: 总是在吃过亏后,才记得曾经有人提醒过. (一)核心军规 (1)不在数据库做运算:cpu计算务必移至业务层 ...

  8. iOS中 UIProgressView 技术分享

    UIProgressView 继承自UIView,用来显示进度的,如音乐,视频的缓冲进度,文件的上传下载进度等.让用户知道当前操作完成了多少,离操作结束还有多远 AppDelegate.m Progr ...

  9. 【Android 系统开发】 Android 系统启动流程简介

    作者 : 万境绝尘 (octopus_truth@163.com) 转载请注明出处 : http://blog.csdn.net/shulianghan/article/details/3889548 ...

  10. 扩展GDAL,支持CNSDTF格式(一)

    扩展GDAL,支持CNSDTF格式(一) 一.        简介 本文主要根据<中华人民共和国国家标准GB/T17798-2007--地理空间数据交换格式(Geospatialdata tra ...