带有 IFormCollection 的 ViewModel 不适用于错误 500 - ASP.NET Core [重复]答案

【问题标题】：ViewModel with IFormCollection Doesn't Work with Error 500 - ASP.NET Core [duplicate]带有 IFormCollection 的 ViewModel 不适用于错误 500 - ASP.NET Core [重复]
【发布时间】：2018-03-21 04:00:28
【问题描述】：

大家好，

我正在尝试将我的 ViewModel 从 JS 传递到我的 ASP.NET Core 控制器，但我遇到了错误代码 500。

这是我的代码：

我的 JavaScript

const myFiles = new FormData(); // I supply this myFiles from my append.
// supposed myFiles has already files inside so don't worry about this.

const myInfo = {
    Id: 0
    Name: "Hello World"
}

const vm = {
    MyInfo: myInfo,
    MyFiles: myFiles
}

axios.post(`/Info/UploadInfo`,
    vm,
    {
        headers:{
            "Content-Type": "multipart/form-data"
        }
    });

我的视图模型

public class MyInfoVm{
    public MyInfo MyInfo {get;set;}
    public IFormCollection MyFiles {get;set;}
}

我的控制器

public IActionResult UploadInfo(MyInfoVm vm){
    return Ok();
}

如果我删除 VM 并仅使用 ViewModel 中的一个字段（ IFormCollection 或 MyInfo ），这将起作用。但问题是，我需要在单个请求中发送多个参数。有什么帮助吗？

【问题讨论】：

IFormCollection 可以收集字段和文件，而 Javascript form 可以同时发送。我会将您的 info 作为表单中的字段。
您不能混合对象和 FormData - 您需要将其他名称/对值（Id: 0 和 Name: "Hello World"）附加到 FormData - 请参阅 How to append whole set of model to formdata and obtain it in MVC
@Tim 你有简单的代码示例吗？
我会努力的。
你是什么意思@Tim

标签： javascript c# asp.net-mvc viewmodel asp.net-core-2.0

【解决方案1】：

Javascript

var fileForm = document.createElement('form');
fileForm.enctype = 'multipart/form-data';
var id = document.createElement('input');
id.name = 'id';
id.value = '0';
fileForm.appendChild(id);

var name = document.createElement('input');
name.name = 'id';
name.value = '0';
fileForm.appendChild(name);

var fileInput = document.createElement('input');

fileForm.appendChild(fileInput);
fileInput.id = 'file-input';
fileInput.type = 'file';
fileInput.name = 'file';

var data = new FormData(fileForm);

【讨论】：