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. C++拾遗(十)类与动态内存分配(2)

    静态成员函数 声明时包含关键字static.注意以下两点: 1.使用静态成员函数时不能通过对象或者this指针来调用,只能使用类名+作用域解析符来调用. 2.静态成员函数只能使用静态成员. new操作 ...

  2. 【PHP】新浪、淘宝的地区 API调用

    /推荐使用新浪的: $ch = curl_init(); $url = "http://ip.dpool.sina.com.cn/iplookup/iplookup.php?format=j ...

  3. 简单代码JS随机,数组操作,延时执行

    <script language="javascript"> var str="baidu.com,163.com,sohu.com,kankan.com,1 ...

  4. UIImagePickerController 操作图库

     UIImagePickerController详解   转载自:http://blog.csdn.net/kingsley_cxz/article/details/9157093 1.UIImage ...

  5. 转:Gulp的目标是取代Grunt

    原文来自于:http://www.infoq.com/cn/news/2014/02/gulp Fractal公司积极参与了数个流行Node.js模块的开发,它最近发布了一个新的构建系统gulp,希望 ...

  6. Android UI 调试常用工具(Dump view UI hierarchy for Automator)

    UI调试时程序员比较头疼的问题:有时候经常会被1dp.2dp的问题,搞得无言以对(Android开发深有体会) 下面介绍一个在实际开发过程中常用的一个调试工具,可以精确到每个View在屏幕中的绝对位置 ...

  7. 微信支付开发+{ping++}微信支付托管

    ------------------------微信支付接口------------------------------- 微信支付开发并没有想象中的那么难,主要是微信提供了sdk. 微信公众号必须是 ...

  8. ural 1671 Anansi's Cobweb

    这道题是并差集的简单应用 #include <cstdio> #include <cstring> #include <algorithm> #define max ...

  9. JDBC连接mysql,TOMCAT错误: Cannot convert value '0000-00-00 00:00:00' from column 10 to TIMESTAMP

    解决思路依据如下URL: http://blog.csdn.net/stail111/article/details/5640109 问题:MySQL数据库,如果数据库中日期字段为空为值为'0000- ...

  10. 单片机汇编语言实现DES加密算法

    目前在金融界及非金融界的保密通信中,越来越多地用到了DES算法.DES(Data Encryption Standard)即数据加密算法,是IBM公司于 1977年研究成功并公开发表的.随着我国三金工 ...