Retrieve object array from FormCollection element in mvc controller

Question

I'm trying to send some data from html page to mvc controller. It's sent as FormData via ajax, and handled in controller as FormCollection. One of the element is an array of object. How can i retrieve this array in controller?

client code================

var products = []

 $('tr').each(function () {
    var row = $(this);
    var product = {};
    product.Id = row.find('.id').val();
    product.Id = row.find('.quantity').val();
    products.push(product);
 });

 var data = new FormData();
 data.append('PersonId', pid);
 data.append('SubmitDate', sdate);
 data.append('Products', products);


 Server code=================

 [HttpPost]
 public ActionResult SalesData(FormCollection data)
 {
     String personId=data["PersonId"].ToString();
     String submitDate=data["SubmitDate"].ToString();

     //how to retrieve Products ??
 }

Any help?

Thank you.

Answer 1

Try to strigify the products and deserialize on server.

data.append('Products', JSON.stringify(products));

on Server (Assume product class with id, value) using JavaScriptSerializer

var serializer = new JavaScriptSerializer();
var productsStr = data["products"].ToString()
var deserializedProducts = serializer.Deserialize<List<Product>>(productsStr);