使用 asp.net mvc 3 和 knockoutjs 发布 viewModel 并上传文件答案

【问题标题】：Posting viewModel and upload files with asp.net mvc 3 and knockoutjs使用 asp.net mvc 3 和 knockoutjs 发布 viewModel 并上传文件
【发布时间】：2011-12-30 09:46:29
【问题描述】：

我们正在使用 knockoutjs postJson 实用程序提交一个 asp.net mvc 视图表单。一切正常，但现在我们想在表单中添加文件上传选项。

根据Uploading file in asp.net mvc，我们在表单中添加了元素和 enctype="multipart/form-data" 属性，但在控制器的 Request.Files 集合中没有得到任何文件

使用 ko.utils.postJson 有什么问题吗？有没有更好的方法将文件连同我的表单数据一起上传？

我的所有元素都使用 KO 绑定，因此无法删除淘汰赛
我们使用 postJson 来模拟表单提交，控制器可以重定向到另一个视图

【问题讨论】：

标签： asp.net-mvc knockout.js

【解决方案1】：

postJson src 在它创建的每个输入上执行JSON.stringify，并将其作为输入元素插入到内部表单元素中：

for (var key in data) {
    var input = document.createElement("INPUT");
    input.name = key;
    input.value = ko.utils.stringifyJson(ko.utils.unwrapObservable(data[key]));
    form.appendChild(input);
}

因此，无法通过 javascript 加载来自文件输入的文件数据以通过 postJson 调用发布，因为它当前存在，因此您最好的选择是仅上传文件并将 JSON 发布在两个单独的要求。也可以将文件输入注入postJson 方法创建的这种形式（通过覆盖该方法），但它有点老套，可能不向前兼容。

【讨论】：

我没有使用 Html.TextBoxFor 类型语法，所以不确定它将如何与控制器模型绑定。我在每个输入和选择元素上使用 KO 数据绑定；我正在使用 jquery 验证/提交处理程序来调用 viewModel 保存方法，该方法又使用 postJson 提交。之前我使用的是 $ajax。我是 JavaScript 新手，所以肯定在这里缺少一些基础知识
模型绑定器用于当数据从客户端返回到服务器（并反序列化为您的操作参数）时，这就是我的意思。它可以解释 JSON 或普通形式的 post 数据，所以你可以使用任何一个。
你能告诉我怎么做吗？我有一个与服务器模型匹配的 KO viewModel。如何将 viewModel + 文件输入显式提交到服务器
我认为你最好的办法是将文件上传与模型发布分开。如果你真的必须将两者结合起来，一种方法是只使用一个隐藏的输入来添加数据并自定义你的模型绑定器以反序列化隐藏的输入，或者使用一些 javascript 文件上传库。跨度>
我将单独上传文件。如果您发表评论作为答案，我会接受。