Unable to send the data from view to controller Asp.net MVC using Jquery

Question

I am trying to post the data from my View to controller, but the count is always 0. I can see in the developer console the data is passed as part of the request but my action method is unable to receive it, I am unable to figure the issue here. Data in Developer Console: Data from UI:

var massagedRawMaterials = [];

        for (var i = 0; i < 5; i++) {
            massagedRawMaterials.push({
                name: 'Raw Material Name',
                shortCode: 'Short Code',
                price: 'Price'
            });
        }

        //pass json array to controller function to save line items
        $.ajax({
            url: "/Home/Create",
            type: "POST",
            data: JSON.stringify({ rawmaterial: massagedRawMaterials }),
            contentType: "application/json",
            dataType: 'json',
            success: function (savingStatus) {
                },
            error: function (xhr, ajaxOptions, thrownError) {
               }




> Model C#:

    public class MaterialViewModel
    {
    public string Name { get; set; }

    public string ShortCode { get; set; }

    public string Price { get; set; }
    }

Controller method:

 

   public ActionResult Create(List<MaterialViewModel> rawmaterial)
    {
       // some processing
    }

  
    
For me the code looks okay or I am unable to find the issue here.

Answer 1

Try this

 $.ajax({
            url: "/Home/Create",
            type: "POST",
            data: { rawmaterial: massagedRawMaterials },
            success: function (savingStatus) {
                       },
            error: function (xhr, ajaxOptions, thrownError) {
                   }