將數組作爲JSON傳遞給MVC控制器

Question

我一直在努力尋找解決此問題的方法。

在我的代碼中，我構建了一個對象的數組;

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或標記的數組。

要發佈數據，我試過了;

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 
} 

我的馬克班看起來像這樣;

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完全錯誤嗎？如何將這些數據轉換爲強類型對象？

非常感謝

Answer 1

$.post()不允許你設置你的AJAX調用的內容類型 - 你可能會發現（如果你使用Fiddler），您的JSON字符串被與內容型「應用發送/ x-www-form-urlencoded「（默認設置），然後導致Asp.Net MVC錯誤地解釋你的數據包。

您可以嘗試使用$.ajax()代替，並將內容類型設置爲「application/json」？

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

Answer 2

@SteveHobbs這裏有正確的答案。另一方面，你應該像JavaScript一樣負責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); 
    } 
}); 

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



     } 
    }); 

根據您的場景進行所需的更改並享受！ :)