吃水不忘挖井人,如果对你有帮助,请说声谢谢。如果你要转载,请注明出处。谢谢!

异步提交时,出现图片不能上传。

起初我定格在  System.Web.Mvc  中。查询源码时,也是没有问题的。那问题出现在哪 里?

答案:JS 

jquery.unobtrusive-ajax.js

经查看,修改如下Demo:

 function asyncRequest(element, options) {
var confirm, loading, method, duration, enctype, is_async = true; confirm = element.getAttribute("data-ajax-confirm");
if (confirm && !window.confirm(confirm)) {
return;
} loading = $(element.getAttribute("data-ajax-loading"));
duration = element.getAttribute("data-ajax-loading-duration") || 0; $.extend(options, {
type: element.getAttribute("data-ajax-method") || undefined,
url: element.getAttribute("data-ajax-url") || undefined,
beforeSend: function (xhr) {
var result;
asyncOnBeforeSend(xhr, method);
result = getFunction(element.getAttribute("data-ajax-begin"), ["xhr"]).apply(this, arguments);
if (result !== false) {
loading.show(duration);
}
return result;
},
complete: function () {
loading.hide(duration);
getFunction(element.getAttribute("data-ajax-complete"), ["xhr", "status"]).apply(this, arguments);
},
success: function (data, status, xhr) {
asyncOnSuccess(element, data, xhr.getResponseHeader("Content-Type") || "text/html");
getFunction(element.getAttribute("data-ajax-success"), ["data", "status", "xhr"]).apply(this, arguments);
},
error: getFunction(element.getAttribute("data-ajax-failure"), ["xhr", "status", "error"])
}); enctype = element.getAttribute("enctype");
if (enctype == "multipart/form-data") {

var form = $(element)[0];
var input_files = $(form).find(":file");
var fileSize = 0;
for (var i = 0; i < input_files.length; i++) {
for (var j = 0; j < input_files[i].files.length; j++) {
fileSize += input_files[i].files[j].size;
}
}
if (fileSize > 1024) {
alert("上传文件大于10M,不允许上传");
return;
}
var formData = new FormData(form);

            $.extend(options, {
async: false,
cache: false,
contentType: false,
processData: false,
data: formData
});
is_async = false;
}
if (is_async)
options.data.push({ name: "X-Requested-With", value: "XMLHttpRequest" }); method = options.type.toUpperCase();
if (!isMethodProxySafe(method)) {
options.type = "POST";
if (is_async)
options.data.push({ name: "X-HTTP-Method-Override", value: method });
}
$.ajax(options);
}
@{
ViewBag.Title = "Index";
}
<script src="~/Scripts/jquery-1.8.2.js"></script>
<script src="~/Scripts/modernizr-2.6.2.js"></script>
<script src="~/Scripts/jquery.unobtrusive-ajax.js"></script>
<script src="~/Scripts/jquery.validate.js"></script>
<script src="~/Scripts/jquery.validate.unobtrusive.js"></script> @model MvcApplication.Models.TestModel
@using (Ajax.BeginForm("TestAjax", "Home", null, new AjaxOptions() { HttpMethod = "POST" ,OnSuccess="Success"}, new { id = "f1", enctype = "multipart/form-data"}))
{
@Html.TextBoxFor(S => S.Name)
@Html.TextBoxFor(S => S.Age)
@Html.TextBoxFor(S => S.fileBase, new { type = "file" })
@Html.TextBoxFor(S => S.IsDel, new { Value = "1" })
<button type="submit">OK</button>
}
<script type="text/javascript">
function Success(data) {
alert(data.Name);
}
</script>
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc; namespace MvcApplication.Controllers
{
public class HomeController : Controller
{
//
// GET: /Home/ public ActionResult Index()
{
return View();
} public ActionResult TestAjax(Models.TestModel model)
{
model.fileBase = null;
return Json(model, JsonRequestBehavior.AllowGet);
} }
}
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web; namespace MvcApplication.Models
{
public class TestModel
{
public HttpPostedFileBase fileBase { get; set; }
public string Name { get; set; }
public int Age { get; set; }
public bool IsDel { get; set; }
}
}

MVC Ajax.BeginForm 提交上传图片的更多相关文章

  1. asp.net MVC  Ajax.BeginForm 异步上传图片的问题

    当debug到这里,你们就发现不管是 Request.Files["Upload"]亦或 Request.Files[0] 都不会取到文件流. 这就是我要说的,当使用Ajax.Be ...

  2. Asp.net Mvc Ajax.BeginForm提交表单

    之前Mvc中一直用Html.BeginForm提交表单,即如下: @using (Html.BeginForm("Add", "News", FormMetho ...

  3. MVC Ajax.BeginForm重复提交解决方法

    mvc使用MVC Ajax.BeginForm提交的时候有重复提交结果的时候检查相关js文件引用情况, 其中mvc4注意 1 2 3 4 @Scripts.Render("~/bundles ...

  4. asp.net mvc Ajax.BeginForm不能异步刷新,或转到新页面,或页面还是刷新了,的原因(或解决办法)(转)

    昨天搞了一下午的Ajax.BeginForm都没能实现异步刷新,一直将返回的数据提交到新的页面,在网上搜了n多方法都不行,问了n多人都没能搞定,今天大一早,就意外的被我发现了问题所在. 布局页: &l ...

  5. 关于MVC Ajax.BeginForm()异步上传文件的问题

    问题描述: 如果用juqery原生的异步上传方式,只要如下方法即可 $.ajax({ type: "GET", url: "test.json", data: ...

  6. 【转】利用Ajax.BeginForm提交文件

    Ajax.BeginForm @using (Ajax.BeginForm("YourAction", "YourController", new AjaxOp ...

  7. mvc中ajax.beginform一次提交重复Post两次的问题解决

    在MVC4中使用ajax.beginform来做添加商品到购物车中的提交操作,结果点击提交按钮后,出现两次post,这样导致商品的数量增加了一倍. 原因:@Scripts.Render("~ ...

  8. ASP.NET MVC下Ajax.BeginForm方式无刷新提交表单

    有时候,不得不考虑到以下场景问题: 数据库表字段会频繁更改扩展,而流行的重业务的js框架过于依赖json数据接口,导致的问题是,数据库表更改 -> 数据接口更改 -> 前段框架逻辑更改.. ...

  9. MVC Html.BeginForm 与 Ajax.BeginForm 使用总结

    最近采用一边工作一边学习的方式使用MVC5+EF6做一个Demo项目, 期间遇到不少问题, 一直处于研究状态, 没能来得及记录. 今天项目进度告一段落, 得以有空记录学习中遇到的一些问题. 由于MVC ...

随机推荐

  1. 『TensorFlow』0.x_&_1.x版本框架改动汇总

    基本数值运算 除法和模运算符(/,//,%)现在匹配 Python(flooring)语义.这也适用于 [tf.div] 和 [tf.mod].要获取基于强制整数截断的行为,可以使用 [tf.trun ...

  2. 皮质学习 HTM 知多少

    目录 Hierarchical Temporal Memeory 0.1 引言 历史 HTM 概览 HTM的层级结构 神经元 HTM 端对端应用框架[^8] 数据编码[^1] 数据编码 数据输入 树突 ...

  3. Redis缓存设计及常见问题

    Redis缓存设计及常见问题 缓存能够有效地加速应用的读写速度,同时也可以降低后端负载,对日常应用的开发至关重要.下面会介绍缓存使 用技巧和设计方案,包含如下内容:缓存的收益和成本分析.缓存更新策略的 ...

  4. Vue(一)

    一.es6语法:let和const es6新增了let命令,用来声明变量.它的用法类似于var,但是所声明的变量,只在let命令所在的代码块内有效. 上面代码在代码块之中,分别用let和var声明了两 ...

  5. python画箱线图

    # -*- coding: utf-8 -*- """ Created on Wed Jun 14 13:00:11 2017 @author: Miao "& ...

  6. python基础----基础知识介绍

    一  编程语言的划分       编译型:将代码一次性全部编译成二进制,然后运行. 缺点:开发效率低,不能跨平台(windows与linux) 优点:执行效率高 代表语言:c语言 解释型:当程序开始运 ...

  7. bfs两种记录路径方法

    #include<cstdio> #include<queue> using namespace std; struct sss { int x,y; }ans[][]; ][ ...

  8. OpenCV学习(一)基础篇

    OpenCV 2 计算机视觉编程手册读书笔记1 矩阵创建 Mat类是OpenCV中非常有用类,用来创建和操作多维矩阵.可以有很多方法构造它. // 构造函数 //! constructs 2D mat ...

  9. @MapperScan使用

    @MapperScan:要扫描mapper类包的路径 还可以扫描多个包,如: @MapperScan({"com.kfit.demo","com.kfit.user&qu ...

  10. ipv4-only网络环境下访问ipv6站点

    使用6plat.org+openVPN(无需资金投入)进入ipv6网络 这里我们主要使用的是6plat.org提供的“46模块——IPv4到IPv6”功能,需要配合openVPN这个软件,支持wind ...