MVC Ajax.BeginForm 提交上传图片
吃水不忘挖井人,如果对你有帮助,请说声谢谢。如果你要转载,请注明出处。谢谢!
异步提交时,出现图片不能上传。
起初我定格在 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 提交上传图片的更多相关文章
- asp.net MVC Ajax.BeginForm 异步上传图片的问题
当debug到这里,你们就发现不管是 Request.Files["Upload"]亦或 Request.Files[0] 都不会取到文件流. 这就是我要说的,当使用Ajax.Be ...
- Asp.net Mvc Ajax.BeginForm提交表单
之前Mvc中一直用Html.BeginForm提交表单,即如下: @using (Html.BeginForm("Add", "News", FormMetho ...
- MVC Ajax.BeginForm重复提交解决方法
mvc使用MVC Ajax.BeginForm提交的时候有重复提交结果的时候检查相关js文件引用情况, 其中mvc4注意 1 2 3 4 @Scripts.Render("~/bundles ...
- asp.net mvc Ajax.BeginForm不能异步刷新,或转到新页面,或页面还是刷新了,的原因(或解决办法)(转)
昨天搞了一下午的Ajax.BeginForm都没能实现异步刷新,一直将返回的数据提交到新的页面,在网上搜了n多方法都不行,问了n多人都没能搞定,今天大一早,就意外的被我发现了问题所在. 布局页: &l ...
- 关于MVC Ajax.BeginForm()异步上传文件的问题
问题描述: 如果用juqery原生的异步上传方式,只要如下方法即可 $.ajax({ type: "GET", url: "test.json", data: ...
- 【转】利用Ajax.BeginForm提交文件
Ajax.BeginForm @using (Ajax.BeginForm("YourAction", "YourController", new AjaxOp ...
- mvc中ajax.beginform一次提交重复Post两次的问题解决
在MVC4中使用ajax.beginform来做添加商品到购物车中的提交操作,结果点击提交按钮后,出现两次post,这样导致商品的数量增加了一倍. 原因:@Scripts.Render("~ ...
- ASP.NET MVC下Ajax.BeginForm方式无刷新提交表单
有时候,不得不考虑到以下场景问题: 数据库表字段会频繁更改扩展,而流行的重业务的js框架过于依赖json数据接口,导致的问题是,数据库表更改 -> 数据接口更改 -> 前段框架逻辑更改.. ...
- MVC Html.BeginForm 与 Ajax.BeginForm 使用总结
最近采用一边工作一边学习的方式使用MVC5+EF6做一个Demo项目, 期间遇到不少问题, 一直处于研究状态, 没能来得及记录. 今天项目进度告一段落, 得以有空记录学习中遇到的一些问题. 由于MVC ...
随机推荐
- spring boot ----> 常用模板freemarker和thymeleaf
===========================freemarker=================================== freemarker 官网:https://freem ...
- Hadoop启动之后jps没有NameNode节点
这是因为多次格式化namenode节点出现的问题 1.先运行stop-all.sh 2.删除原目录,即core-site.xml下配置的<name>hadoop.tmp.dir</n ...
- SWUST OJ(963)
小偷的背包 #include<stdio.h> #include<stdlib.h> int s, flag, n, *a; //主函数之外定义的变量为全局变量 void df ...
- webForm TO MVC
- restore not found的错误
tensorflow保存模型后,restore的时候报参数not found是什么原因呢 一般预测的流程是:建图然后restore参数,很有可能你的变量作用域和train的时候不一样,那么在现在的变量 ...
- 如何在linux下开启FTP服务
如何在linux下开启FTP服务 1. 首先服务器要安装ftp软件,查看是否已经安装ftp软件下: #which vsftpd 如果看到有vsftpd的目录说明服务器已经安装了ftp软件 2. ...
- mstOne
云鸟(2017年6月6日) 1.html标签语义化的好处 a:利于seo优化 b:在样式丢失的时候,还是可以比较好的呈现结构 c:更好的支持各种终端,例如无障碍阅读和有声小说等. d:利于团队开发和维 ...
- zabbix3.4.7页面中文乱码
无须重启任何服务,刷新页面即可.
- MapServer Tutorial——MapServer7.2.1教程学习(大纲)
MapServer Tutorial——MapServer7.2.1教程学习(大纲) 前言 最近在学习Gis方面的知识,因为电脑硬件配置偏低,顾选择MapServer入手.网上搜索MapServer系 ...
- Spring Boot + Spring Cloud 实现权限管理系统 (Spring Security 版本 )
技术背景 到目前为止,我们使用的权限认证框架是 Shiro,虽然 Shiro 也足够好用并且简单,但对于 Spring 官方主推的安全框架 Spring Security,用户群也是甚大的,所以我们这 ...