javascript - 通过ajax将复杂对象发送到 Controller

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

<分区>

我正在尝试通过传递一些复杂数据的 ajax 调用我的 Controller 。

我的 Controller 的操作方法。

public ActionResult CalculatePremium(QuoteDetailsViewModel quoteDetails)
{
    ViewBag.Message = "Your application description page.";

    return View();
}

Javascript 代码:

quoteDetails = {
    StartDate: '10-10-2016',
    Drivers: [{ Name: 'Test', Occupation: 'Test2', 
       DateOfBirth: '10-10-1985'}, { Name: 'Test2', Occupation: 'Test4',
       DateOfBirth: '10-10-1945' }],
    Claims: ['5-5-2010']
    };


    $.ajax({
        type: "GET",
        url: '/Home/CalculatePremium',
        contentType: "application/json; charset=utf-8",
        data: quoteDetails,
        dataType: "json",
        success: function () { alert('Success'); },
        error: function (xhr, status, error) { alert('Error:'); }
    });

查看模型(不要担心字符串被用于 DateTime - 它只是用于测试)

public class QuoteDetailsViewModel
{
    public string StartDate { get; set; }
    public List<Driver> Drivers { get; set; }
    public List<string> Claims { get; set; }
}

public class Driver
{
    public string Name { get; set; }
    public string Occupation { get; set; }
    public string DateOfBirth { get; set; }
}

当我调用操作方法时,对象会填充以下内容:

{MotorInsuranceCalculator.Models.QuoteDetailsViewModel}
Claims: null
Drivers: Count = 2
StartDate: "10-10-2016"

quoteDetails.Drivers
Count = 2
[0]: {MotorInsuranceCalculator.Models.Driver}
[1]: {MotorInsuranceCalculator.Models.Driver}

quoteDetails.Drivers[0]
{MotorInsuranceCalculator.Models.Driver}
DateOfBirth: null
Name: null
Occupation: null

quoteDetails.Drivers[1]
{MotorInsuranceCalculator.Models.Driver}
DateOfBirth: null
Name: null
Occupation: null

如能提供解决此问题的任何帮助,我们将不胜感激。

最佳答案

contentType 是您要发送的数据类型,因此 application/json;默认是 application/x-www-form-urlencoded; charset=UTF-8.

如果你使用application/json,你必须使用JSON.stringify()来发送JSON对象。

JSON.stringify() 将 javascript 对象转换为 json 文本并将其存储在字符串中。

$.ajax({
    type: "POST",
    url: '/Home/CalculatePremium',
    contentType: "application/json; charset=utf-8",
    data: JSON.stringify(quoteDetails),
    dataType: "json",
    success: function () { alert('Success'); },
    error: function (xhr, status, error) { alert('Error:'); }
});

此外,您必须使用 HttpPost 动词才能执行 post 请求。

[HttpPost]
public ActionResult CalculatePremium(QuoteDetailsViewModel quoteDetails)
{
   ViewBag.Message = "Your application description page.";
   return View();
}

关于javascript - 通过ajax将复杂对象发送到 Controller ,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/42551750/

相关文章:

c# - 从用于外部登录身份验证的 Twitter API 获取用户的电子邮件 ASP.NET MVC C#

jquery - 如何使我的代码将焦点集中到 jQuery 对话框中的特定按钮?

javascript - 将参数传递给angularjs中的ng-click函数

javascript - 设置搜索字段的默认值 - 请帮忙!

c# - 手动处理 WinForms 控件的滚动

javascript - 滚动事件在 chrome 上不起作用,在 firefox 上不精确

jquery - 使用用户控制元素和 jQuery 自动更正 ID 引用

javascript - 寻找一个非常简单的 UpdateListItems for SPservices with Sharepoint 2007 示例

javascript - 在游戏中使用 Web Worker 有意义吗?

c# - 如何从命令行发布 .Net Core ASP 便携版?