AJAX Post to ASP.NET MVC 6 Controller操作方法和参数为null

Question

我在ASP.NET MVC和发送AJAX帖子时遇到了一个奇怪的问题.我在页面上有一个id为'lnkGetExpirDates'的锚标记.当用户点击它时,我试图简单地将这个硬编码数据发送到我的控制器,这样它就可以将它作为参数使用并将结果返回给页面.

但是,在控制器中,参数始终为空/默认值.请参阅下面的代码,如果我犯了一个愚蠢的错误,请告诉我.

这是我的AJAX帖子:

$("#lnkGetExpirDates").click(function () {
    e.preventDefault();

    var data = {
        StartDate: "1/19/2016",
        EndDate: "4/19/2016",
        ProductType: "New",
        Count: 1
    };


    $.ajax({
        url: '/Products/GetExpirationDates',
        type: 'POST',
        data: JSON.stringify(data),
        contentType: 'application/json; charset=utf-8',
        dataType: 'html',
        success: function (data) {
            $('#ExpirationDates').val(data);
        }
    });

});

这是我的控制器的动作方法:

// POST: Product/GetExpirationDates
[HttpPost]
//[ValidateAntiForgeryToken]
public IActionResult GetExpirationDates(GetExpirationDatesViewModel vm)
{
    // TODO: Get expiration dates and return them in the response

    return View();
}

这是GetExpirationDatesViewModel:

public DateTime StartDate { get; set; }
public DateTime EndDate { get; set; }
public string ProductType { get; set; }
public int Count { get; set; }

请注意,我甚至在没有使用模型的情况下尝试了这一点,只是简单地将参数添加到Action方法中,例如startDate,endDate,productType和Count,但所有内容都是null.

Answer 1

当您将内容类型值指定为application/json时,对服务器发出的ajax请求将在请求正文中以json格式发送您的js对象作为Request Payload .因此,在您的操作方法中,您应该使用该[FromBody]属性.

public IActionResult GetExpirationDates([FromBody] GetExpirationDatesViewModel vm)
{
   return View();
}

当您想要发送具有属性的复杂js对象时,应该执行此操作,该属性又是另一个模型/类型

但是您发送的数据是平面视图模型.所以你真的不需要json字符串化js对象.您也可以删除内容类型属性,也不会发送复杂js对象的字符串化版本.

这应该工作正常.

$.ajax({
    url: '/Products/GetExpirationDates',
    type: 'POST',
    data: data,      
    dataType: 'html',
    success: function (data) {
        console(data);
    }
});

上面的代码将js对象作为键值对(普通表单数据)发送,模型绑定器将能够将表单数据映射到服务器中的视图模型对象.请查看此帖子以获取更详细的说明.

另外,我建议您使用Url.Action辅助方法为操作方法生成正确的相对URL.

url: '@Url.Action("GetExpirationDates","Products")',

如果您的js代码在剃刀视图中,则上述应该有效.如果你的代码是一个外部JS文件中,使用描述的解决方案这篇文章.