Note that there are some explanatory texts on larger screens.

plurals
  1. POPass multiple JSON objects to MVC3 action method
    text
    copied!<p>JQuery code:</p> <pre> //This passes NULL for "CategoryID", "CategoryName", "ProductID", "ProductName" $("#btnPost").click(function () { var CategoryModel = { CategoryID: 1, CategoryName: "Beverage" }; var ProductModel = { ProductID: 1, ProductName: "Chai" }; var data1 = {}; data1["cat"] = CategoryModel; data1["prd"] = ProductModel; var jsonData = JSON.stringify(data1); $.ajax({ url: url + '/Complex/ModelTwo', //This works but property values are null type: 'post', dataType: 'json', data: { "cat": CategoryModel, "prd": ProductModel }, //jsonData, cache: false, success: function (result) { alert(result); }, error: function (xhr, ajaxOptions, thrownError) { alert(thrownError); } }); }); </pre> <p>MVC Code (C#):</p> <pre><code> public class ComplexController : Controller { public string ModelOne(Category cat) { return "this took single model..."; } public string ModelTwo(Category cat, Product prd) { return "this took multiple model..."; } } public class Category { public int CategoryID { get; set; } public string CategoryName { get; set; } } public class Product { public int ProductID { get; set; } public string ProductName { get; set; } } </code></pre> <p>Now the issue is, I couldn't get it working by passing "CategoryMode", "ProductModel" into "ModelTwo" action method. The JQuery post correctly identifies the action method "ModelTwo" but "cat", "prd" property values are null. "CategoryID", "CategoryName", "ProductID", "ProductName" all are null despite hitting that method. </p> <pre> //THIS ONE WORKS FINE... $("#btnPost").click(function () { var CategoryModel = { CategoryID: 1, CategoryName: "Beverage" }; var ProductModel = { ProductID: 1, ProductName: "Chai" }; var data1 = {}; data1["cat"] = CategoryModel; data1["prd"] = ProductModel; var jsonData = JSON.stringify(data1); $.ajax({ url: url + '/Complex/ModelOne', //This works type: 'post', dataType: 'json', data: CategoryModel, cache: false, success: function (result) { alert(result); }, error: function (xhr, ajaxOptions, thrownError) { alert(thrownError); } }); }); </pre> <p>So what's wrong with my first JQuery call to "ModelTwo" action method?</p> <p>I spent lots of time figuring this out, but not sure what's going on. There is no issue with routing here because I can land on the right action method...</p> <p>Any help will be greatly appreciated.</p> <p>Thanks!</p>
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload