MVC5 - 如何文件上传通过与模型使用jQuery AJAX到控制器控制器、文件上传、模型、AJAX

2023-09-10 22:00:26 作者:你为谁隐身i

我需要使用jQuery AJAX我上传的文件传递给我的控制器。

记者:

  $('#btnpopu preG)。点击(函数(){
        $阿贾克斯({
            键入:POST,
            网址:'/会员/注册,
            数据:$('#frmRegister')serializeArray(),。
            数据类型:JSON,
            标题:fnGetToken()
            beforeSend:功能(XHR){

            },
            成功:功能(数据){
                //做一点事
            },
            错误:函数(XHR){

            }
        })
})
 

查看:

  @model Test.RegisterViewModel

@ {
       使用Html.BeginForm(没什么,没什么,FormMethod.Post,新增功能{.ID =frmPopU pregister,.enctype =的multipart / form-data的})
}

<输入类型=文件/>
//其余的我强类型的模型在这里
<输入类型=按钮值=按钮/>
//其余的code在这里
 

控制器:

  [HttpPost()]
[使用AllowAnonymous()]
[ValidateAntiForgeryToken()]

公共无效寄存器(RegisterViewModel模型)
{

    如果(Request.Files.Count大于0){//总是0

    }

    如果(ModelState.IsValid){
          //做一些与模型
    }
}
 
jsp使用jquery ajax 请求返回json数据不成功

我可以得到模型值得很好,但Request.Files总是返回null。我也尝试过使用HttpPostedFileBase但它也总是返回null

  [HttpPost()]
[使用AllowAnonymous()]
[ValidateAntiForgeryToken()]

公共无效寄存器(RegisterViewModel模型,HttpPostedFileBase文件)
{
    //文件总是空

    如果(ModelState.IsValid){
          //做一些与模型
    }
}
 

解决方案

首先,你需要给你的文件控制名称属性,因此它可以值回发到您的控制器

 <输入类型=文件名称=文件/> //
 

然后序列化的形式和相关的文件(S)

  VAR FORMDATA =新FORMDATA($('表')得到(0));
 

和后回来

  $。阿贾克斯({
  网址:@ Url.Action(注册,会员),
  键入:POST,
  数据:FORMDATA,
  过程数据:假的,
  的contentType:假的,
  成功:功能(数据){
    ....
  }
});
 

还要注意文件输入需要的表单标签内

I need to pass my upload file to my controller using jquery ajax.

JS:

$('#btnpopupreg').click(function () {
        $.ajax({
            type: 'POST',
            url: '/Membership/Register',
            data: $('#frmRegister').serializeArray(),
            dataType: 'json',
            headers: fnGetToken(),
            beforeSend: function (xhr) {

            },
            success: function (data) {
                //do something
            },
            error: function (xhr) {

            }
        })
})

View:

@model Test.RegisterViewModel

@{
       using Html.BeginForm(Nothing, Nothing, FormMethod.Post, New With {.id = "frmPopUpRegister", .enctype = "multipart/form-data"})
}

<input type="file" />
//rest of my strongly typed model here
<input type="button" value="BUTTON" />
//rest of the code here

Controller:

[HttpPost()]
[AllowAnonymous()]
[ValidateAntiForgeryToken()]

public void Register(RegisterViewModel model)
{

    if (Request.Files.Count > 0) { //always 0

    }

    if (ModelState.IsValid) {
          //do something with model
    }
}

I can get the model value just fine but Request.Files always returns null. I also tried using HttpPostedFileBase but it also always return null

[HttpPost()]
[AllowAnonymous()]
[ValidateAntiForgeryToken()]

public void Register(RegisterViewModel model, HttpPostedFileBase files)
{
    //files always null

    if (ModelState.IsValid) {
          //do something with model
    }
}

解决方案

First you need to give you file control a name attribute so it can post back a value to your controller

<input type="file" name="files" /> // 

Then serialize your form and the associated file(s)

var formdata = new FormData($('form').get(0));

and post back with

$.ajax({
  url: '@Url.Action("Register", "Membership")',
  type: 'POST',
  data: formdata,
  processData: false,
  contentType: false, 
  success: function (data) {
    ....
  }        
});

Note also the file input needs to be inside the form tags