1.Form表单提交

<p>Form提交</p>
<form action="@Url.Action("SavePictureByForm")" enctype="multipart/form-data" method="post">
<input id="pic" name="pic" type="file" />
<input type="submit" value="提交" />
</form>

2.Ajax.BeginForm,原理也是Form表单提交

<p>Ajax.BeginForm</p>
@using(Ajax.BeginForm("SavePictureByForm", null, new AjaxOptions() { OnSuccess = "PostSuc", OnFailure = "PostFail", HttpMethod = "Post"}, new {enctype = "multipart/form-data"}))
{
<input type="file" name="pic" id="pic" multiple="multiple" />
<input type="submit" value="提交" />
}

以上两种方式,在后台用同一种方法可以获取数据: 但是这两种方法会造成页面刷新,有时会影响用户操作.

 public ActionResult SavePictureByForm()
{
HttpFileCollectionBase files = Request.Files;
var file = files[0];
bool isOk = false;
string msg = string.Empty;
//....OtherDO return Content("<script>window.location.href='/home/index';</script>");
}

3.Ajax提交  用此方法需要用到FileReader类,再获取到文件的Base64数据,将Base64数据Post过去

<p>Ajax:以上传图片为例</p>
<input type="file" id="picAjax"/>
<input type="button" id="submitPic" value="提交" />
<img id="selImg" src="" alt="用作图片预览" />
    var picString = "";
$(function () {
$("#picAjax").change(function (e) {
var file = e.delegateTarget.files[0];
//在此可以对选择的文件进行判断:文件类型 文件大小等
//..... var reader = new FileReader();
reader.readAsDataURL(file);
reader.onload = function (ret) {
picString = reader.result
//预览图片
$("#selImg").attr({ "src": picString });
}
}); $("#submitPic").click(function () {
$.ajax("home/SavePicture", {
type: "post",
datatype: "json",
data: picString,
error: function () { },
success: function (result) {
if (result) {
alert(result.msg);
}
}
});
});

后端接收

 [HttpPost]
public ActionResult SavePicture(string picString)
{
bool isOk = false;
string msg = string.Empty;
//其他操作
//.........
//.........
return Json(new { suc = isOk, msg = msg });
}

第三种方法做到了真正异步提交.但是如果选择的文件较大,可能会出现问题(未测试).

对于图片预览 前两种方法也可用base64数据进行图片预览.

ASP.NET MVC上传文件的几种方法的更多相关文章

  1. asp.net MVC 上传文件 System.Web.HttpException: 超过了最大请求长度

    APS.NET MVC 上传文件出现  System.Web.HttpException: 超过了最大请求长度 这个问题 原因是 默认最大上传文件大小为4096,而我提交的文件太大了. 解决方案:修改 ...

  2. ASP.NET MVC上传文件----uploadify的使用

    课程设计需要实现上传文件模块,本来ASP.NET是有内置的控件,但是ASP.NET MVC没有,所以就有两种方法:自定义和采用第三方插件.由于时间的关系,故采用第三方插件:uploadify. upl ...

  3. ASP.NET MVC上传文件

    最近参考网络资料,学习了ASP.NET MVC如何上传文件.最基本的,没有用jQuery等技术. 1.定义Model public class TestModel    {        [Displ ...

  4. asp.net mvc 上传文件

    转至:http://www.cnblogs.com/fonour/p/ajaxFileUpload.html 0.下载 http://files.cnblogs.com/files/fonour/aj ...

  5. asp.net 客户端上传文件全路径获取方法

    asp.net  获取客户端上传文件全路径方法: eg:F:\test\1.doc 基于浏览器安全问题,浏览器将屏蔽获取客户端文件全路径的方法,只能获取到文件的文件名,如果需要获取全路径则需要另想其他 ...

  6. ASP.NET上传文件的几种方法

      //上传文件实例 if (fileDealer.HasFile)//判断文件是否存在        {            string filepath = "";     ...

  7. net上传文件的三种方法

    ASP.NET依托.net framework类库,封装了大量的功能,使得上传文件非常简单,主要有以下三种基本方法. 方法一:用Web控件FileUpload,上传到网站根目录. Test.aspx关 ...

  8. GitHub常用上传文件的两种方法 附带常见的问题及Git安装教程

    从早上下课到现在一直在琢磨如何给Github下载本地文件,中午饭都没吃.还好是解决了,感觉挺有成就感的.O(∩_∩)O哈哈~ 好哒 闲话不说,说重点. 一.git的安装 百度云:http://pan. ...

  9. ASP.NET MVC上传文件 未显示页面,因为请求实体过大。解方案

    在Dropzone中设置   maxFilesize: 350, //MB 但上传的文件没有到最大限定350MB,就报出来 未显示页面,因为请求实体过大的错误 Web.config中设置  maxAl ...

随机推荐

  1. java2实用教程102小程序(分数计算和流水线计算

    import java.util.Scanner; public class test{ public static void main(String args[]){ Rational a=new ...

  2. switch语句中的选择因子

    switch语句能否用作用在byte上,能否作用在long上,能否作用在String上? switch选择语句的格式为: switch(intergral-selector){ case  integ ...

  3. 关于Sublime text 2中Emmet的安装 _html:xt无效

    其实这个网上很多教程,有一些方法是可行的,但是有一些方法是行不通的. 虽然Sublime text 2有不同平台的版本,但是安装起来,还是有点差异的. 先简单介绍一下Emmet,Emmet是Zen-c ...

  4. Azure构建PredictionIO和Spark的推荐引擎服务

    Azure构建PredictionIO和Spark的推荐引擎服务 1. 在Azure构建Ubuntu 16.04虚拟机 假设前提条件您已有 Azure 帐号,登陆 Azure https://port ...

  5. SwitchySharp怎样设置 ( proxy switch!的设置与使用方法)

    规则列表URL  https://autoproxy-G{过}F{滤}Wlist.googlecode.com/svn/trunk/G{过}F{滤}Wlist.txt 注:不同的代{过}{滤}理  相 ...

  6. 路由器WDS桥接教程

    因为有吧友买了此款路由又不会桥接,因此做这个教程.老鸟自动路过,废话不多说,下面开始讲解. 1.wifi密码破解和路由器用户名和密码部分请自行解决,我只讲桥接部分.首先,在浏览器里输入192.168. ...

  7. COJ 0260 HDNOIP201204四个国王

    HDNOIP201204四个国王 难度级别:A: 运行时间限制:1000ms: 运行空间限制:51200KB: 代码长度限制:2000000B 试题描述 在N*M的棋盘上摆国际象棋中的“国王”.如果两 ...

  8. HDOJ 1302(UVa 573) The Snail(蜗牛爬井)

    Problem Description A snail is at the bottom of a 6-foot well and wants to climb to the top. The sna ...

  9. C# 同步/并发队列ConcurrentQueue (表示线程安全的先进先出 (FIFO) 集合)

    http://msdn.microsoft.com/zh-cn/library/dd267265(v=vs.110).aspx static void Main(string[] args) { // ...

  10. 《SDN核心技术剖析和实战指南》2.1交换机核心技术小结

    对于SDN交换机的技术,其实也适用于传统的交换机,只不过控制部分被分离出来而已.传统交换机的控制面主要是转发表的管理以及网络状态之类的各种表,现在这些都由控制器来担心.转发面主要由转发决策.背板和输出 ...