Ajax 發布到 ASP.net MVC 控制器 - 對象屬性為空

Question

我有一個這樣構造的ajax帖子：

var myData = [
    {
        id: "a",
        name: "Name 1"
    },
    {
        id: "b",
        name: "Name 2"
    }
];

$.ajax({
    type: 'POST',
    url: '/myurl/myAction',
    data: { items: myData },
    dataType: 'json',
    error: function (err) {
        alert("error - " + err);
    }
});

還有一個 MVC 控制器：

[HttpPost]
public JsonResult MyAction(MyClass[] items)
{

}

MyClass只是數據的簡單表示：

public class MyClass {
    public string Name {get; set; }
    public string Id {get; set; }
}

當 javascript 發出 post 請求時，控制器操作確實收到 2 個項目，但是這些項目中的屬性（id、名稱）為空。

在 fiddler 中檢查請求，正文如下所示：

Name                 | Value
items[0][Name]       | Name 1
items[0][Id]         | a
items[1][Name]       | Name 2
items[1][Id]         | b

我錯過了什么嗎？

Answer 1

我錯過了什么嗎？

是的，請查看以下文章以了解默認模型綁定器期望用於綁定集合的正確連線格式。 換句話說，要使其正常工作，而不是：

items[0][Name]       | Name 1
items[0][Id]         | a
items[1][Name]       | Name 2
items[1][Id]         | b

你的有效載荷應該是這樣的：

items[0].Name       | Name 1
items[0].Id         | a
items[1].Name       | Name 2
items[1].Id         | b

不幸的是，使用 jQuery 實現此有效負載可能會非常令人沮喪。 出於這個原因，如果您想使用 AJAX 將復雜對象/數組發送到您的服務器，我建議您使用 JSON 負載：

$.ajax({
    type: 'POST',
    url: '/myurl/myAction',
    data: JSON.stringify({ items: myData }),
    contentType: 'application/json',
    error: function (err) {
        alert("error - " + err);
    }
});

注意事項：

• data: JSON.stringify({ items: myData })而不是data: { items: myData }
• 添加contentType: 'application/json'
• 擺脫了dataType: 'json'

現在你的有效載荷看起來像這樣：

{"items":[{"id":"a","name":"Name 1"},{"id":"b","name":"Name 2"}]}

Answer 2

您可以使用此代碼來解決問題：

$.ajax({
    url: '/myurl/myAction',
    data: { '': items },
    method: "POST",
    dataType: 'json',
    success: function (xhr, status, response) {
    },
    error: function (xhr, status, response) {
    }
});

[HttpPost]
public JsonResult MyAction(IEnumerable<MyClass> items)
{

}