MVC 5.0(or5.0↓) Ajax.BeginForm 异步上传附件问题,答案是不能的!

MVC 5.0(or5.0↓)  Ajax.BeginForm 异步上传附件问题,答案是不能的!

(请注意我这里说的异步!)

来看一下下面这段一步提交file的代码

//前台 .cshtml 文件

<script src="~/jquery.unobtrusive-ajax.js"></script>@using (Ajax.BeginForm("upLoadAsync", "UploadFile",
    new AjaxOptions {
        HttpMethod = "Post",
        OnSuccess = "success"  }  , new { enctype = "multipart/form-data" }))
{
    <input type="file" id="fileupload" name="Upload" />
    <input type="submit" value="上传" id="btn">
}  

//C#代码

public string upLoadAsync()
{
  HttpPostedFileBase file = Request.Files["Upload"];

  HttpPostedFileBase file = Request.Files[0];

  //其余代码省略

  //......

}

当debug到这里,你们就发现不管是 Request.Files["Upload"]亦或是 Request.Files[0] 都不会取到文件流。

这就是我要说的,当使用Ajax.BeginForm(jquery.unobtrusive-ajax.js) 异步上传是不可行的,因为文件流不会被C#代码读取

但是并不影响 Ajax.BeginForm(jquery.unobtrusive-ajax.js) 异步提交表单的特性。

那我我们应该如何异步提交表单呢?

利用 $("#formID").ajaxSubmit({});这个方法异步提交表单并且上传文件

//前台 .cshtml 文件
<script src="~/jquery.form.js"></script>

<form id="formID" method="post" enctype="multipart/form-data">
    @Html.Hidden("yearNow1", @ViewBag.yearNow as string)//输入一些要提交表单的值

    <input type="file" id="fileupload" name="Upload" />
    <input type="button" value="上传" id="btn">//这里用button代替submit
 </form>

<script type="text/javascript">

 $("#btn").click(function () {  $("#formID").ajaxSubmit({
                url: "@Url.Action("upLoadAsync", "UploadFile")",
                type: "post",
                success: function (data) {
                   //......
                },
                error: function (aa) {
                    alert(aa);
                }
            });});
//C#代码

public string upLoadAsync()
{
  HttpPostedFileBase file = Request.Files["Upload"];


  HttpPostedFileBase file = Request.Files[0];


  //其余代码省略


  //......


}

 

当debug到这里,你们就发现不管是 Request.Files["Upload"]亦或是 Request.Files[0] 都可以取到文件流。

当controller返回值也可以成功进入seccess方法中。

请注意我代码中标红的位置,以防遗漏导致一直debug无果问题!

总结一下:

1、MV5 5.0中异步提交表单方法两种:Ajax.BeginForm(new AjaxOptions:post) 和 $("#formID").ajaxSubmit({})

2、MVC 5.0中异步提交表单上传文件一种:$("#formID").ajaxSubmit({})

时间: 2024-10-10 23:41:42

MVC 5.0(or5.0↓) Ajax.BeginForm 异步上传附件问题,答案是不能的!的相关文章

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

问题描述: 如果用juqery原生的异步上传方式,只要如下方法即可 $.ajax({ type: "GET", url: "test.json", data: {username:$("#username").val(), content:$("#content").val()}, dataType: "json", success: function(data){ alert("");

asp.net mvc ajax.beginform()无法上传文件

Asp.Net Mvc使用Ajax.BeginForm上传文件Request.Files始终为null. 使用jquery.form.js插件能解决问题.asp.net mvc ajax.beginform()无法上传文件

文件的上传(表单上传和ajax文件异步上传)

一.表单上传: html客户端部分: <form action="upload.ashx" method="post" enctype="multipart/form-data"> 选择文件:<input type="file" name="file1" /><br /> <input type="submit" value="上传&q

使用FormData实现ajax文件异步上传

1.传统的web开发文件上传一般是基于form表单的文件上传,同步的方式,用户体验差,可控性也差 2.异步上传的实现 有以下方式 2.1 借助浏览器插件 一般需要安装一些类似flash的插件  这种方式 缺点:需要安装插件  优点:可控性强,性能高 2.2 这种是伪异步上传,借助表单向隐藏的iframe提交,然后通过iframe通信操作当前页面 这种方式可控行查,体验一般,见下面代码  2.3 借助html5 里的 FormData 对象,可实现进度控制,异步的上传方式,见代码 iframe方式

jquery 通过ajax FormData 对象上传附件

之前上传附件都是用插件,或者用form表单体检(这个是很久以前的方式了),今天突发奇想,自己来实现附件上传,具体实现如下 html: <div>   流程图: <input id="file" type="file" >   <button ng-click="bpmmainFunction.createBpm()">提交</button></div> js: $scope.bpmmai

ajaxfileupload异步上传附件增加参数的方法

1.js文件(注意红色字体): // JavaScript Document jQuery.extend({ createUploadIframe: function(id, uri) { //create frame var frameId = 'jUploadFrame' + id; if(window.ActiveXObject) { var io = document.createElement('<iframe id="' + frameId + '" name=&qu

ajaxfileupload异步上传附件添加參数的方法

1.js文件 // JavaScript Document jQuery.extend({ createUploadIframe: function(id, uri) { //create frame var frameId = 'jUploadFrame' + id; if(window.ActiveXObject) { var io = document.createElement('<iframe id="' + frameId + '" name="' + fr

spring MVC上传附件

spring mvc为我们封装了十分简单的上传附件的方法,以下通过一个例子学习. 1.jsp <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%

HTML5 FormData 用jquery 异步上传报错

平时做表单都是跳转提交的,但是今天要做一个ajax图片异步上传, 网上搜索了下,方法都比较老了,居然还有用flash的, 普通的表单上传通过jquery的serialize()转换成querystring后就可以直接ajax post 上传,但是碰到文件上传就不奏效了,型号html5有个方法FormData()可以实现上传, 我写的代码如下: function upThumbSubmit() { if(!window.FormData) { alert('your brower is too o