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

时间:2012-04-04 08:45:18

标签: c# asp.net-mvc json asp.net-mvc-4

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

在我的代码中,我正在构建一个对象数组;

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 */ });

OR

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完全错了吗?如何将此数据转换为强类型对象?

非常感谢

3 个答案:

答案 0 :(得分:14)

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

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

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

答案 1 :(得分:13)

@SteveHobbs在这里有正确的答案。另一方面,您应该像JSON.stringify那样使用JavaScript有效负载。如果以另一种方式执行此操作,则会在反序列化进入的数据时出现类似“Invalid JSON primitive”的异常。

以下是您的样本的完整解决方案:

$.ajax({

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

答案 2 :(得分:1)

此代码解决了我的问题:

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) {



        }
    });

为您的方案进行所需的更改并享受! :)