javascript - Serialize form post to controller -

html:

<form id="testform">     <div>         customer 1         <input type="hidden" name="employeeid" value="1" />         <input type="checkbox" name="firstname" value="10"> test 10         <input type="checkbox" name="firstname" value="20"> test 20         <input type="checkbox" name="firstname" value="30"> test 30         <input type="checkbox" name="firstname" value="40"> test 40         <input type="checkbox" name="firstname" value="50"> test 50         <input type="checkbox" name="firstname" value="60"> test 60     </div>     <div>         customer 2         <input type="hidden" name="employeeid" value="2" />         <input type="checkbox" name="firstname" value="100"> test 100         <input type="checkbox" name="firstname" value="200"> test 200         <input type="checkbox" name="firstname" value="300"> test 300         <input type="checkbox" name="firstname" value="400"> test 400         <input type="checkbox" name="firstname" value="500"> test 500         <input type="checkbox" name="firstname" value="600"> test 600     </div> </form>  <button id="btn" type="button">click</button> 

javascript (jquery):

$('#btn').click(function () {      var objcustomer = {};     objcustomer.customerid = 22;     objcustomer.companyname = "test company";      var resultdata = json.stringify({         employeedata: $('#testform').serializearray(), // want testform data , set "resultdata"         customerdata: objcustomer     });      var options = {};     options.url = "/home/post/";     options.type = "post";     options.data = resultdata;     options.datatype = "json";     options.contenttype = "application/json";     options.success = function (result) { if (result != null) { { alert("success"); } } };     options.error = function () { alert("error"); };      $.ajax(options);  }); 

controller:

public jsonresult post(employeecustomer data) {     try     {         list<employee> emp = data.employeedata;         customer cust = data.customerdata;          return json(data, jsonrequestbehavior.allowget);     }     catch     {         return json(false, jsonrequestbehavior.allowget);     } } 

customer.cs class

public int customerid { get; set; } public string companyname { get; set; } 

employee.cs class

public int employeeid { get; set; } public string firstname { get; set; } public string lastname { get; set; } 

employeecustomer.cs class

public list<employee> employeedata { get; set; } public customer customerdata { get; set; } 

and question :

i want "testform" input data , post controller.when post controller , data.employeedata count appears data list null miss ?

why can not "employeeid" , "firstname" list values form in controller , set employee class properties ?

i normalize little bit first:

var resultdata = {     employeedata: $('#testform').serializearray(),     customerdata: objcustomer };  options.data = json.stringify(resultdata); 

then, if @ sort of employeedata being posted in console, you'll see it's not list of employees - it's list of objects random name/value pairs:

employeedata: [ 0: {name: "employeeid", value: "1"} 1: {name: "firstname", value: "10"} 2: {name: "employeeid", value: "2"} 3: {name: "firstname", value: "100"}] 

mvc isn't going know is, because it's array of objects properties name , value, not list of employees. posts data fine, mvc won't work unless names of object's properties identical model's. so issue, think, naming conventions used in context of form.

edit: think issue need understand form posting lots of name/value pairs. take, instance, following form:

<div>     customer 1     <input type="hidden" name="employeeid" value="1" />     <select name="firstname">         <option value="100">test 100</option>         <option value="200">test 200</option>         <option value="300">test 300</option>         <option value="400">test 400</option>         <option value="500">test 500</option>         <option value="600">test 600</option>     </select> </div>  <div>     customer 2     <input type="hidden" name="employeeid" value="2" />     <select name="firstname">         <option value="100">test 100</option>         <option value="200">test 200</option>         <option value="300">test 300</option>         <option value="400">test 400</option>         <option value="500">test 500</option>         <option value="600">test 600</option>     </select> </div> 

it's going post 4 things controller: employeeid, firstname, employeeid, , firstname. that's because entire form has 4 name/value pairs. these objects don't correspond mvc model.

like @haim770 says - in example, problem every time click checkbox, name/value pair posted mvc controller, doesn't have list<employee>.