Unable to Send List Of Array via ajax to Controller-CodePudding

I have list of array Generated from dynamically created textbox values .The Issue Is while passing data to controller using ajax ,the count of list is showing in jsonresult but unable to get the list.Its showing Like [object,Object],[object,Object] like the image I added. What I want to retrieve data from list.

My Data Binding Code

     $('#tbl tbody tr').each(function () {
        var objlist = [];
       
        var count = 0;
        var row = $(this).closest('tr');
        var rowIndex = $(this).closest('tr').index();
        row.find('input[type=text]').each(function () {
           
            count  = 1;
                var id    = $(this).attr('id');
                var value = $(this).val();
                var field = $(this).attr('name');
                objlist.push({
                    "Id": id,
                    "field": field,
                    "value": value
                });
                });
       
        tblList.push(objlist);
        });

My Ajax Sending Method

        $.ajax({
        type: 'POST',
        url: '@Url.Action("Action", "Controller")',
        data:  {tableData: tblList},
        global: false,
        dataType: "json",
        traditional: true,
        async: false,
        success: function (data) {
          ///
            }
        }
    });

After Modification Its Showing this Thank you.

CodePudding user response：

This code was tested using Visual Studio and working properly

Ajax should use application/json content type

$.ajax({
        type: 'POST',
        url: '@Url.Action("Action", "Controller")',
        data: JSON.stringify(tblList),
        contentType: 'application/json; charset=utf-8',
        dataType: 'json',
        success: function (data) {
          ///
            }
        }
    });

on server side create a viewmodel

public class TableData
{
public int Id {get; set;}
public string Field {get; set;}
public string Value{get; set;}
}

and change action header too

public JsonResult InsertData([FromBody]List<TableData> tableData)

and I think it is a bug in your code you have array inside of another array. You have to fix it before using code

      objlist.push({
                    "Id": id,
                    "field": field,
                    "value": value
                });
                });
       
        tblList.push(objlist);

if you need 2 arrays try this action

public JsonResult InsertData([FromBody] List<List<TableData>> tableData)