MVC Form not able to post List of objects

Question

so I have an MVC Asp net app that is having issues  Essentially  I have a View that contains a form  and its contents are bound to a list of objects  Within this loop  it loads PartialView s with the items being looped over  Now everything works up till the submittion of the form  When it gets submitted  the controller is sent a null list of objects  The code below demonstates the problems    Parent View    model IEnumerable lt PlanCompareViewModel gt   using  Html BeginForm  ComparePlans    Plans   FormMethod Post  new   id    compareForm         lt div gt       foreach  var planVM in Model                 Html Partial   partialView   planVM         lt  div gt       partialView    model PlanCompareViewModel  lt div gt       Html HiddenFor p   gt  p PlanID       Html HiddenFor p   gt  p CurrentPlan       Html CheckBoxFor p   gt  p ShouldCompare      lt input type  submit  value  Compare   gt   lt  div gt    And these are the classes for the above code   PlanViewModel    public class PlansCompareViewModel        public int PlanID   get  set        public Plan CurrentPlan   get  set        public bool ShouldCompare   get  set        public PlansCompareViewModel Plan plan                ShouldCompare   false          PlanID   plan PlanId          CurrentPlan   plan             public PlansCompareViewModel                    TODO  Complete member initialization           public static IEnumerable lt PlansCompareViewModel gt  CreatePlansVM IEnumerable lt Plan gt  plans                return plans Select p   gt  new PlansCompareViewModel p   AsEnumerable              Controller   public class PlansController   MyBaseController        HttpPost      public ActionResult ComparePlans IEnumerable lt PlanCompareViewModel gt  model                   the model passed into here is NULL           And the problem is in the controller action  As far as I am aware  it should be posting an enumerable list of PlanCompareViewModels  yet it is null  When in inspect the post data being sent  it is sending the correct params  And if I were to change  IEnumerable  to  FormCollection   it contains the correct values  Can anyone see why the binder is not creating the correct object  I can get around this using javascript  but that defeats the purpose  Any help would be greatly appreciated

User · Answer

Please read this  http   haacked com archive 2008 10 23 model-binding-to-a-list aspx You should set indicies for your html elements  name  attributes like planCompareViewModel 0  PlanId  planCompareViewModel 1  PlanId to make binder able to parse them into IEnumerable  Instead of  foreach  var planVM in Model  use for loop and render names with indexes

User · Answer

Your model is null because the way you re supplying the inputs to your form means the model binder has no way to distinguish between the elements   Right now  this code    foreach  var planVM in Model         Html Partial   partialView   planVM      is not supplying any kind of index to those items   So it would repeatedly generate HTML output like this    lt input type  hidden  name  yourmodelprefix PlanID    gt   lt input type  hidden  name  yourmodelprefix CurrentPlan    gt   lt input type  checkbox  name  yourmodelprefix ShouldCompare    gt    However  as you re wanting to bind to a collection  you need your form elements to be named with an index  such as    lt input type  hidden  name  yourmodelprefix 0  PlanID    gt   lt input type  hidden  name  yourmodelprefix 0  CurrentPlan    gt   lt input type  checkbox  name  yourmodelprefix 0  ShouldCompare    gt   lt input type  hidden  name  yourmodelprefix 1  PlanID    gt   lt input type  hidden  name  yourmodelprefix 1  CurrentPlan    gt   lt input type  checkbox  name  yourmodelprefix 1  ShouldCompare    gt    That index is what enables the model binder to associate the separate pieces of data  allowing it to construct the correct model   So here s what I d suggest you do to fix it   Rather than looping over your collection  using a partial view  leverage the power of templates instead   Here s the steps you d need to follow    Create an EditorTemplates folder inside your view s current folder  e g  if your view is Home Index cshtml  create the folder Home EditorTemplates   Create a strongly-typed view in that directory with the name that matches your model   In your case that would be PlanCompareViewModel cshtml    Now  everything you have in your partial view wants to go in that template    model PlanCompareViewModel  lt div gt       Html HiddenFor p   gt  p PlanID       Html HiddenFor p   gt  p CurrentPlan       Html CheckBoxFor p   gt  p ShouldCompare      lt input type  submit  value  Compare   gt   lt  div gt    Finally  your parent view is simplified to this    model IEnumerable lt PlanCompareViewModel gt   using  Html BeginForm  ComparePlans    Plans   FormMethod Post  new   id    compareForm         lt div gt       Html EditorForModel    lt  div gt      DisplayTemplates and EditorTemplates are smart enough to know when they are handling collections   That means they will automatically generate the correct names  including indices  for your form elements so that you can correctly model bind to a collection

[c#] MVC Form not able to post List of objects

Examples related to c#

Examples related to asp.net-mvc

Examples related to asp.net-mvc-4

Examples related to asp.net-mvc-partialview