asp.net mvc 4 - Passing Model from view to controller with Jquery Ajax -

i'm try pass model values view controller using ajax jquery. in controller model shown null.

controller called ajax method, problem object in controller showing null.

this simple structure of model:

public class invoice {     public invoice(invoiceheader invheader, list<invoiceitems> invitmem)      {         this.invheader = invheader;         this.invitmem = invitmem;     }      public invoiceheader invheader { get; private set; }     public list<invoiceitems> invitmem { get; private set; }  } 

this structure of controller:

[httppost] public actionresult insertitems(list<invoice> invoice) {     //list<invoiceitems> asd = new list<invoiceitems>();     //asd = invoice.();      return json(true, jsonrequestbehavior.allowget); } 

this view:

@model beetatechmodel.invoice  @{     viewbag.title = "index";     var val = json.encode(model); }  <h2>index</h2>      <script type="text/javascript">          $(document).ready(function () {              $("#btnsubmit").click(function () {                  // var val = json.encode(model);                  var check = @html.raw(val);                  $.ajax({                     type: 'post',                     url: "invoice/insertitems",                     data: '{info:' + json.stringify(check) + '}' ,                     contenttype: 'application/json; charset=utf-8',                     datatype: "json",                     success: function (data) {                         alert(data);                             }                 });             });         });     </script>  @{html.renderpartial("invoiceheader", model.invheader);}  @{html.renderpartial("invoiceitems", model.invitmem);}          <input type="submit" id="btnsubmit" value="log in" /> 

you have 4 issues code.

• the first 1 in ajax call must this:

  $.ajax({     url: 'invoice/insertitems',     type: 'post',     data: json.stringify(check),     contenttype: 'application/json; charset=utf-8',     success: function (data) {         alert(data);     } }); 

• the second issue subscribed .click event of submit button without canceling default action of button. if button inside form, when click it, browser post form server , redirect away action of form leaving no time ajax call ever execute. make sure canceling default action of button:

  $("#btnsubmit").click(function (e) {     e.preventdefault();      ... ajax call comes here }); 

• the third issue invoice model doesn't have default (parameterless) constructor meaning cannot use argument controller action without writing custom model binder because default model binder wouldn't know how instantiate it.

• and fourth issue both invheader , invitmem properties of invoice model not have public setters meaning json serializer unable set values. make sure have fixed invoice model:

  public class invoice {     public invoiceheader invheader { get; set; }     public list<invoiceitems> invitmem { get; set; } }