将数组作为 JSON 发布到 MVC 控制器

Posted 2023-04-12

【中文标题】将数组作为 JSON 发布到 MVC 控制器

【英文标题】：Post Array as JSON to MVC Controller

【发布时间】：2012-04-17 23:03:10

【问题描述】：

我一直在努力寻找解决这个问题的方法。

在我的代码中，我正在构建一个对象数组；

var $marks = [];

var mark = function ( x, y, counter )
    this.x = x;
    this.y = y;
    this.counter = counter;


$marks.push(new mark(1, 2, 0));   
$marks.push(new mark(1, 2, 1));
$marks.push(new mark(1, 2, 2));

现在我想将此数据发布到 MVC 控制器，因此我认为控制器中的数据类型将是 List<Mark> Marks 或 Marks 数组。

要发布数据，我试过了；

var json = JSON.stringify($marks);
$.post('url', json).done(function(data) /* handle */ );

或

var json =  Marks: $marks ;
$.post('url', json).done(function(data) /* handle */ );

第二种方式，在查看发布的数据时，看起来像这样

Marks[0][x]: 1
Marks[0][y]: 2
Marks[0][counter]: 0
Marks[0][x]: 1
Marks[0][y]: 2
Marks[0][counter]: 1
Marks[0][x]: 1
Marks[0][y]: 2
Marks[0][counter]: 2

但我不知道如何将其转换为控制器中的强类型对象？

我的控制器看起来像这样；

[HttpPost]
public ActionResult JsonSaveMarks(List<Mark> Marks)
    // handle here

我的 Mark 类看起来像这样；

public class Mark
     public string x  get; set; 
     public string y  get; set; 
     public string counter  get; set; 

我已经阅读了有关创建自定义 JsonFilterAttribute 或使用 System.Web.Script.Serialization.javascriptSerializer 类的其他类似问题，但我无法解决任何问题

我在这里有什么明显的遗漏吗？我把控制器中的 DataType 弄错了吗？如何将发布的这些数据转换为强类型对象？

非常感谢

【问题讨论】：

你在 MVC 中的 Mark-class 是什么样子的？

@Pbirkoff 我已经用班级更新了问题

查看这个问题，尤其是第一个答案：***.com/questions/4789481/…

【参考方案1】：

$.post() 不允许您设置 AJAX 调用的内容类型 - 您可能会发现（如果您使用 Fiddler）您的 Json 字符串正在发送的内容类型为“application/x-www- form-urlencoded”（默认设置），这会导致 Asp.Net MVC 错误地解释您的数据包。

您可以尝试改用$.ajax()，并将内容类型设置为“application/json”吗？

http://api.jquery.com/jQuery.ajax/

【讨论】：

啊，你打败了我，和我有同样的想法

谢谢！在所有的头痛之后，我知道这将是一件简单的事情！将我的代码也更改为使用$.ajax()，将数据作为JSON.stringify($marks)

非常感谢。就我而言，这是内容类型。

【参考方案2】：

@SteveHobbs 在这里有正确的答案。另一方面，您应该像您一样JSON.stringify JavaScript 有效负载。如果以另一种方式执行此操作，则会在反序列化传入的数据时收到一个异常，告诉您“无效的 JSON 原语”。

这是您的示例的完整解决方案：

$.ajax(

    url: '/home/index',
    type: 'POST',
    data: JSON.stringify($marks),
    dataType: 'json',
    contentType: 'application/json',
    success: function (data, textStatus, jqXHR) 
        console.log(data);
    
);

【参考方案3】：

这段代码解决了我的问题：

C# 类：

public class MediaAccountContent

    public Guid IdMedia  get; set; 
    public string Value  get; set; 



public class User

    public string Firstname  get; set; 
    public string Lastname  get; set; 
    public List<MediaAccountContent> MediaAccountContents  get; set; 

MVC 动作：

public ActionResult SavePlace(User user)


    return Content("OK");

Javascript：

    var mediaAccountsJson = [];

    for (var i = 0; i < 10; i++)
    
        mediaAccountsJson.push(
            IdMedia: i,
            Value: "AAA" + i
        );

    

    var datatItem =
    
        Firstname: "Test Firstname",
        Lastname: "Test Lastname",
        MediaAccountContents: mediaAccountsJson
    ;

    $.ajax(
        type: "POST",
        contentType: 'application/json; charset=utf-8',
        data: JSON.stringify(datatItem),
        url: urlAction,
        success: function (status) 



        
    );

根据场景进行所需的更改并尽情享受！ :)

【讨论】：

这段代码只发布json对象而不是对象数组