c# - html.beginForm post null value for List<strongly typed> to controller via jQuery Ajax function in ASP>NET-MVC5 -


i have asp.net-mvc5 website. need allow user update/ edit 2 emergency contact details. achieve sending "list mymodel" razor view , in view got 2 @html.beginform. have list because know have 2 record. printing value list via index 0 record 1 , 1 record 2. jquery ajax function used post data controller.

now form 1 emergency contact detail 1 working fine form 2 2nd emergency contact detail posting null values controller. have commet form1 , tried submit form2 still null values. not sure why happening.

controller

  [authorize]     [httpget]     public actionresult editemergencycontact()     {          int _studententityid = 0;          _studententityid = _studentprofileservices.getstudentidbyidentityuserid(user.identity.getuserid());          list<emergencycontact> _emergencycontactmodel = new list<emergencycontact>();          _emergencycontactmodel = _studentprofileservices.getemergencycontactbystudentid(_studententityid);          return partialview("editemergencycontact_partial", _emergencycontactmodel);      }      [authorize]     [httppost]     public actionresult editemergencycontact(list<emergencycontact> _emergencycontactmodel)     {        try         {             if (_emergencycontactmodel!=null && _emergencycontactmodel.count()>0)             {                 if (modelstate.isvalid)                 {                       int _entityid = _studentprofileservices.editemergencycontactbystudentid(                         new emergencycontact                         {                             emergencycontactid = _emergencycontactmodel[0].emergencycontactid,                             studentid = _emergencycontactmodel[0].studentid,                             nameofcontact = _emergencycontactmodel[0].nameofcontact,                             relationship = _emergencycontactmodel[0].relationship,                             telephone = _emergencycontactmodel[0].telephone,                             mobile = _emergencycontactmodel[0].mobile,                             address = _emergencycontactmodel[0].address                         });                      if (_entityid != 0)                     {                         return json(new { response = "success" });                     }                     else                     {                         return json(new { response = "error" });                     }                 }                 else                 {                     return json(new { response = "invalid entry" });                 }             }             else             {                   return json(new { response = "error! in updating record" });             }         }         catch (dataexception ex)         {             modelstate.addmodelerror("", "unable edit emergency contact" + ex);         }          return redirecttoaction("myprofile", "studentprofile");     } 

view

@using (html.beginform("editemergencycontact", "studentprofile", formmethod.post, new { id = "editno2emergencycontactform" })) {   @html.antiforgerytoken()  <div class="form-horizontal">     <h4>emergency contact 2</h4>     <hr />     @html.validationsummary(true, "", new { @class = "text-danger" })     @html.hiddenfor(model => model[1].emergencycontactid)      <div class="form-group">         @html.labelfor(model => model[1].studentid, "studentid", htmlattributes: new { @class = "control-label col-md-2" })         <div class="col-md-10">             @html.editorfor(model => model[1].studentid, new { htmlattributes = new { @class = "form-control" } })             @html.validationmessagefor(model => model[1].studentid, "", new { @class = "text-danger" })         </div>     </div>      <div class="form-group">         @html.labelfor(model => model[1].nameofcontact, htmlattributes: new { @class = "control-label col-md-2" })         <div class="col-md-10">             @html.editorfor(model => model[1].nameofcontact, new { htmlattributes = new { @class = "form-control" } })             @html.validationmessagefor(model => model[1].nameofcontact, "", new { @class = "text-danger" })         </div>     </div>      <div class="form-group">         @html.labelfor(model => model[1].relationship, htmlattributes: new { @class = "control-label col-md-2" })         <div class="col-md-10">             @html.editorfor(model => model[1].relationship, new { htmlattributes = new { @class = "form-control" } })             @html.validationmessagefor(model => model[1].relationship, "", new { @class = "text-danger" })         </div>     </div>      <div class="form-group">         @html.labelfor(model => model[1].telephone, htmlattributes: new { @class = "control-label col-md-2" })         <div class="col-md-10">             @html.editorfor(model => model[1].telephone, new { htmlattributes = new { @class = "form-control" } })             @html.validationmessagefor(model => model[1].telephone, "", new { @class = "text-danger" })         </div>     </div>      <div class="form-group">         @html.labelfor(model => model[1].mobile, htmlattributes: new { @class = "control-label col-md-2" })         <div class="col-md-10">             @html.editorfor(model => model[1].mobile, new { htmlattributes = new { @class = "form-control" } })             @html.validationmessagefor(model => model[1].mobile, "", new { @class = "text-danger" })         </div>     </div>      <div class="form-group">         @html.labelfor(model => model[1].address, htmlattributes: new { @class = "control-label col-md-2" })         <div class="col-md-10">             @html.editorfor(model => model[1].address, new { htmlattributes = new { @class = "form-control" } })             @html.validationmessagefor(model => model[1].address, "", new { @class = "text-danger" })         </div>     </div>      <div class="form-group">         <div class="col-md-offset-2 col-md-10">             <input type="submit" value="save" class="btn btn-default" />         </div>     </div>  </div> } 

jquery function

 $('#editno2emergencycontactform').submit(function (e) {      e.preventdefault();      var formurl = $(this).attr("action");      alert($(this).serialize());      $.ajax({         url: formurl,         type: "post",         data: $(this).serialize()     }).done(function (data, textstatus, jqxhr) {          if (data.response == "success") {              $(this).mymessagedialog({                 _messageblockid: "_statusmessage",                 _messagecontent: "record been updated successfully",                 _messageblockwidth: "300px"             });              $('div#_statusmessage').on('dialogclose', function (event) {                 window.location = "/studentprofile/myprofile";             });         }         else {              $(this).mymessagedialog({                 _messageblockid: "_statusmessage",                 _messagecontent: "<div class='errormessage'>" + data.response + "</div>",                 _messageblockwidth: "300px"             });         }     }).fail(function (jqxhr, textstatus, errorthrown) {         $(this).mymessagedialog({             _messageblockid: "_statusmessage",             _messagecontent: "<div class='errormessage'> error in updating record! " + textstatus + "  " + errorthrown + "  "+jqxhr.status +"</div>",             _messageblockwidth: "350px"         });          $('div#_statusmessage').on('dialogclose', function (event) {             window.location = "/studentprofile/myprofile";         });     }); }); 

for form 1: 1 works

 @using (html.beginform("editemergencycontact", "studentprofile", formmethod.post, new { id = "editno1emergencycontactform" })) 

..............

 $('#editno1emergencycontactform').submit(function (e) { 

you using same controller post action different forms. action update model (list of entities) entity present on first position. models has list of [entity0, entity1] in form view remove entity0 because binding 1 entity1 model having list.

here have 2 approaches:

make post controller action more generic

    public actionresult editemergencycontact (list<emergencycontact> _emergencycontactmodel)             {                  try                 {                      if (_emergencycontactmodel != null && _emergencycontactmodel.count() > 0)                      {                         if (modelstate.isvalid)                         {                             bool validation = true;                              (int = 1; < _emergencycontactmodel.count(); i++)                             {                                  if (_emergencycontactmodel[i].emergencycontactid != null)                                 {                                      int _entityid = _studentprofileservices.editemergencycontactbystudentid(                                      new emergencycontact                                     {                                         emergencycontactid = _emergencycontactmodel[i].emergencycontactid,                                         studentid = _emergencycontactmodel[i].studentid,                                         nameofcontact = _emergencycontactmodel[i].nameofcontact,                                         relationship = _emergencycontactmodel[i].relationship,                                         telephone = _emergencycontactmodel[i].telephone,                                         mobile = _emergencycontactmodel[i].mobile,                                         address = _emergencycontactmodel[i].address                                     });                                      if (_entityid == 0)                                     {                                         validation = false;                                         break;                                     }                                 }                             }                              if (validation)                             {                                 return json(new { response = "success" });                             }                             else                             {                                 return json(new { response = "error" });                             }                         }                         else                         {                             return json(new { response = "invalid entry" });                         }                     }                     else                     {                         return json(new { response = "error! in updating record" });                     }                 }                 catch (dataexception ex)                 {                     modelstate.addmodelerror("", "unable edit emergency contact" + ex);                 }                  return redirecttoaction("myprofile", "studentprofile");             } 

option 2, not pass model empty entities controller, hide inside form values:

@using (html.beginform("editemergencycontact", "studentprofile", formmethod.post, new { id = "editno2emergencycontactform" })) {   @html.antiforgerytoken()  <div class="form-horizontal">     <h4>emergency contact 2</h4>     <hr />     @html.validationsummary(true, "", new { @class = "text-danger" })     @* here pas list 0  model recieved value , viceversa if edit model[0]*@     @html.hiddenfor(model => model[0].emergencycontactid)     @html.hiddenfor(model => model[0].studentid)     @html.hiddenfor(model => model[0].nameofcontact)     @html.hiddenfor(model => model[0].relationship)     @html.hiddenfor(model => model[0].telephone)     @html.hiddenfor(model => model[0].mobile)     @html.hiddenfor(model => model[0].address)     @html.hiddenfor(model => model[0].address)      @html.hiddenfor(model => model[1].emergencycontactid)      <div class="form-group">         @html.labelfor(model => model[1].studentid, "studentid", htmlattributes: new { @class = "control-label col-md-2" })         <div class="col-md-10">             @html.editorfor(model => model[1].studentid, new { htmlattributes = new { @class = "form-control" } })             @html.validationmessagefor(model => model[1].studentid, "", new { @class = "text-danger" })         </div>     </div>      <div class="form-group">         @html.labelfor(model => model[1].nameofcontact, htmlattributes: new { @class = "control-label col-md-2" })         <div class="col-md-10">             @html.editorfor(model => model[1].nameofcontact, new { htmlattributes = new { @class = "form-control" } })             @html.validationmessagefor(model => model[1].nameofcontact, "", new { @class = "text-danger" })         </div>     </div>      <div class="form-group">         @html.labelfor(model => model[1].relationship, htmlattributes: new { @class = "control-label col-md-2" })         <div class="col-md-10">             @html.editorfor(model => model[1].relationship, new { htmlattributes = new { @class = "form-control" } })             @html.validationmessagefor(model => model[1].relationship, "", new { @class = "text-danger" })         </div>     </div>      <div class="form-group">         @html.labelfor(model => model[1].telephone, htmlattributes: new { @class = "control-label col-md-2" })         <div class="col-md-10">             @html.editorfor(model => model[1].telephone, new { htmlattributes = new { @class = "form-control" } })             @html.validationmessagefor(model => model[1].telephone, "", new { @class = "text-danger" })         </div>     </div>      <div class="form-group">         @html.labelfor(model => model[1].mobile, htmlattributes: new { @class = "control-label col-md-2" })         <div class="col-md-10">             @html.editorfor(model => model[1].mobile, new { htmlattributes = new { @class = "form-control" } })             @html.validationmessagefor(model => model[1].mobile, "", new { @class = "text-danger" })         </div>     </div>      <div class="form-group">         @html.labelfor(model => model[1].address, htmlattributes: new { @class = "control-label col-md-2" })         <div class="col-md-10">             @html.editorfor(model => model[1].address, new { htmlattributes = new { @class = "form-control" } })             @html.validationmessagefor(model => model[1].address, "", new { @class = "text-danger" })         </div>     </div>      <div class="form-group">         <div class="col-md-offset-2 col-md-10">             <input type="submit" value="save" class="btn btn-default" />         </div>     </div>  </div> } 

the controller update both entities list :

int _entityid_0 = _studentprofileservices.editemergencycontactbystudentid( new emergencycontact {     emergencycontactid = _emergencycontactmodel[0].emergencycontactid,     studentid = _emergencycontactmodel[0].studentid,     nameofcontact = _emergencycontactmodel[0].nameofcontact,     relationship = _emergencycontactmodel[0].relationship,     telephone = _emergencycontactmodel[0].telephone,     mobile = _emergencycontactmodel[0].mobile,     address = _emergencycontactmodel[0].address });  int _entityid_1 = _studentprofileservices.editemergencycontactbystudentid( new emergencycontact {     emergencycontactid = _emergencycontactmodel[1].emergencycontactid,     studentid = _emergencycontactmodel[1].studentid,     nameofcontact = _emergencycontactmodel[1].nameofcontact,     relationship = _emergencycontactmodel[1].relationship,     telephone = _emergencycontactmodel[1].telephone,     mobile = _emergencycontactmodel[1].mobile,     address = _emergencycontactmodel[1].address });  if (_entityid_0 != 0 && _entityid_1 != 0) {     return json(new { response = "success" }); } else {     return json(new { response = "error" }); } 

your approach bad, should update address 1 one not complex list of address.


Comments