模型如何将 Javascript FormData 与 Asp.net 控制器模型绑定答案

【问题标题】：How model bind Javascript FormData with Asp.net Controllers Model模型如何将 Javascript FormData 与 Asp.net 控制器模型绑定
【发布时间】：2016-04-12 15:29:17
【问题描述】：

是否可以将 ASP.NET 控制器模型与提交数据为 FormData 的 ajax 请求自动绑定。

在我提供的示例中，我需要使用 HttpContext.Current.Request.Form["property_name"] 接收数据，因为如果我提供与提交的表单数据相同的模型，则所有值都等于 null；

还是 ASP.NET 模型绑定仅适用于 JSON 请求？

简单代码如下：

查看：

@using (Html.BeginForm("Post", "Test", FormMethod.Post, new { @class="test-form"}))
{
    <input type="text" name="firstName"/>
    <input type="text" name="lastName"/>
    <button type="submit">Submit</button>
}

脚本：

<script>
    $('.test-form').on('submit', function (e) {
        e.preventDefault();
        var formData = new FormData(this);

        $.ajax({
            url: "@Url.Action("TestPost", "Test")",
            method: "POST",
            data: formData,
            processData: false,
            success: function(e){
            }
        });
    });
</script>

控制器：

    [HttpPost]
    public ActionResult TestPost()
    {
        var firstname = HttpContext.Current.Request.Form["firstName"];
        var lastName =  HttpContext.Current.Request.Form["lastName"];
        return PartialView("TestPost");
    }

不工作的控制器：

   public class User
{
    public string firstName { get; set; }
    public string lastName { get; set; }
}

   [HttpPost]
    public ActionResult TestPost(User model) //model values are null
    {

        return PartialView("TestPost");
    }

【问题讨论】：

使用 Ajax.BeginForm 了解更多信息，请查看此链接hanselman.com/blog/ASPNETMVCPreview4UsingAjaxAndAjaxForm.aspx
你忘了ContentType: false,
@rashfmnb 如果我的 ajax 请求在 js 文件中怎么办？
@Musa 确实成功了，太棒了。小心解释为什么/如何？（我会尝试自己用谷歌搜索，但是..）
请看这个链接stackoverflow.com/questions/21766348/…

标签： javascript c# asp.net ajax asp.net-mvc

【解决方案1】：

当您将 FormData 对象与 ajax 一起使用时，数据将作为 multipart/form-data 发送，并且会自动为您设置内容类型标头并使用正确的边界。
您可以覆盖内容类型并将 tit 设置为您想要的任何内容，这就是这里发生的事情。
你可能会想我没有这样做，你的好朋友 jQuery 为你做的。它为您 (application/x-www-form-urlencoded) 设置了 $.ajax 的默认内容类型，这几乎使请求无效。
要停止此操作，即阻止 jQuery 设置内容类型标头，您必须将 contentType 参数设置为 false。

【讨论】：