如何將Javascript數組獲取到MVC控制器

Question

我正在構建一個asp.net應用程序，用戶可以在其中訂購食物，還擁有一個管理員頁面，管理員可以在該頁面登錄並在特定星期內制作菜單。 我已經解決了“菜單制作器”中的所有問題，並且當我按下“保存”按鈕時，菜單中的每個值都進入了一個javascript數組。

所以要解決這個問題。 當我按下保存按鈕時，我想將數組序列化為json，然后將其傳遞給我的mvc控制器。

我正在嘗試使用Ajax。 這是保存按鈕單擊的完整代碼：

$("#CreateMenuBtn").on('click', function () {
FullMenu.push(
    {
        "Year": $("#YearInput").val(),
        "Week": $("#WeekInput").val(),
        "Products": MenuArray
    }
);
var dataToPost = JSON.stringify({ methodParam: FullMenu });

$.ajax({
    type: "POST",
    url: '@Url.Action("Index", "Home")',
    contentType: "application/json; charset=utf-8",
    dataType: 'JSON',
    data: dataToPost,
    traditional: true
});
console.log(FullMenu);
});

當我現在調試並檢查data值時，它是完全正確的並且采用JSON格式：

methodParam
 [0]
   Year: "2019"
   Week: "4"
   Products:
   [0]
      WeekDay: "Måndag"
      Food: "kött"
      Price: "54kr"
      Cabinet: "C"
   [1]
      Weekday: "Onsdag"
      Food: "Köttbullar"
      Price: "80kr"
      Cabinet: "B"

現在，我想將其發送給我的MVC控制器。

我有一個叫做Menu和Product的類，它看起來像這樣：

public class Menu
{
    public int ID { get; set; }

    public string Year { get; set; }

    public string Week { get; set; }

    public virtual List<Product> Products { get; set; }

}



public class Product
{
    public int ID { get; set; }

    public string Description { get; set; }

    public int Price { get; set; }

    public char Cabinet { get; set; }

    public int MenuID { get; set; }

    public int Day { get; set; }
}

這是我在控制器中想到的：

    public IActionResult Index(List<Menu> methodParam)
    {
       foreach(Menu item in methodParam)
        {
            string des = item.Week + item.Year;
        }
        return View();
    }

但是當我在foreach循環內的動作中進行調試時， methodParam的值為0。

因此，我需要幫助的是如何將數組放入C＃。 我希望這能解釋我的情況，希望能得到som的幫助。

提前致謝！

Answer 1

嘗試這個，

 var FullMenu = [];
        var Menu1 = {};
        Menu1['Year'] = "2016",
            Menu1['Week'] = "Jan";
        FullMenu.push(Menu1);
        var Menu2 = {};
        Menu2['Year'] = "2017",
            Menu2['Week'] = "Feb";
        FullMenu.push(Menu2);
        var dataToPost = FullMenu;
        $.ajax({
            url: '@Url.Action("Index", "Home")',
            type: 'POST',
            data: {
                methodParam: dataToPost
            },

Answer 2

首先嘗試使c＃類結構與json對象具有相同的屬性名稱，然后嘗試

public IActionResult Index(string methodParam)
    {
       List<Menu> menu = new JavaScriptSerializer().Deserialize<Menu>(methodParam);
       foreach(Menu item in menu)
        {
            string des = item.Week + item.Year;
        }
        return View();
    }

Answer 3

這解決了問題：D將url更改為/Home(Controller name)/Index(Action name)

var dataToPost = JSON.stringify(jsonData);

$.ajax({
    type: "POST",
    url: '/Home/Create',
    contentType: "application/json; charset=utf-8",
    dataType: 'JSON',
    data: dataToPost,
    traditional: true
});

並且需要使[FromBody]像這樣執行操作：

[HttpPost]
public IActionResult Create([FromBody] Dictionary<string, object> jsonMenu)
{
    //Code
    return RedirectToAction("Index", "Home");
}

非常感謝你們試圖幫助的人:)