Form within a foreach loop not posting the model back to the controller

Question

I've searched around and can't find an answer to my problem.

I've got a View that takes accepts Foo in like so:

@model IEnumerable<MyApplication.Models.Foo>

Inside of the view I've got a table. I populate the the table just doing a simple foreach loop through my Foo model. I have added a column where a user can add details to each row in a text area and save.

So the view looks like this:

@foreach (var item in Model)
  {
    <tr>
      <th>
           @using (Html.BeginForm("AddDetails", "MyController", FormMethod.Post))
             {
               @Html.AntiForgeryToken()        
               @Html.HiddenFor(u => item.Id)

               @Html.TextAreaFor(u => item.Details, new { @class = "form-control" })                              

               <input type="submit" value="Save" class="btn btn-sm btn-default" />
             }
      </th>
    </tr>
  }

My controller is setup like this:

    [HttpPost]
    public ActionResult AddDetails(Foo foo)
    { 
    }

When I set a breakpoint on that controller foo always has null values for the Details property and the Id is always 0. When it's passed into the view it's got all of the properties set to right, so I'm not sure why it is not posting back properly?

I've tried this:

@using (Html.BeginForm("AddDetails", "MyController", FormMethod.Post, new { foo = Model }))

I have also tried removing the foreach loop and changing it to pass in just a single Model to the View and for the View to accept just the single model instead of an IEnumerable. When I do this it posts back just fine.

And that does not work either. I'm wondering if it has something to do with the fact that my form is within a foreach loop and perhaps I need to do a little more work like add a data-id attribute to the element and just capture the click event on the button and do an AJAX call to the controller and pass the right values along that way?

EDIT Sorry I completely forgot the view model. Here is what that looks like:

public class Foo
{
    public int Id { get; set; }

    public string Details { get; set; }
}

May help if you share more about the view model you're binding to the view/using in the Form — Don Cheadle, Sep 13 '16 at 17:46
what happens when you change your `foreach` to a `for` loop? I'm pretty sure that's your problem, as this way, the default modelbinder cannot correctly rebuild your object to post. [See this question](http://stackoverflow.com/questions/15636284/for-each-loop-with-controls-and-submitting-form-html-beginform-in-mvc-4) as a reference — Jonesopolis, Sep 13 '16 at 17:49
@Jonesopolis I will try changing it to a `for` loop now. I got rid of the `foreach` loop just to test it out and it posts back just fine when I get rid of it. I'll update with another comment after I have tried that. — maxshuty, Sep 13 '16 at 17:52
Look at the html your generating. The `name` attributes are `name="item.Details"` and your `Foo` model does not have a property named `item`. While there are hack to fix this, your view makes no sense and is a confusing user experience (and a sure way to lose your customers) - your generating multiple forms but you can only ever submit one form. — , Sep 13 '16 at 22:57
Use a`for` loop or custom `EditorTemplate` (refer [this answer](http://stackoverflow.com/questions/30094047/html-table-to-ado-net-datatable/30094943#30094943)) but inside one `
` element and change the method to `public ActionResult AddDetails(List model) so that all changes are submitted in one action. — , Sep 13 '16 at 22:57

score 2 · Accepted Answer · answered Sep 13 '16 at 17:57

Generally speaking it's bad form to post to a different model than what your form view is composed from. It makes a lot of things difficult, not the least of which is recovering from validation errors.

What you're doing here is looping through a list of Foo and creating multiple forms that will each submit only a single Foo to an action that takes only a single Foo. While the post itself is fine, using the *For helpers on a model that is not the same as what you're posting to will likely not generate the proper input names necessary for the modelbinder to bind the posted values onto that other model. At the very least, if you need to return to this view because of a validation error, you will not be able to keep the user's posted data, forcing them to repeat their efforts entirely.

Ideally, you should either post the entire list of Foo and have just one form that wraps the iteration (in which case, you would need to use for rather than foreach). Or you should simply list the Foos with a link to edit a particular Foo, where you would have a form for just one Foo.

Shamseer K · Answer 2 · 2016-09-13T18:00:32.367

0

try to do this.possible problems

form should outside the table single form for whole table

wrap your column editor inside tbody not thead

@using (Html.BeginForm("AddDetails", "MyController", FormMethod.Post))
{
//thead and tbody
    }

edited Sep 13 '16 at 18:00

answered Sep 13 '16 at 17:52

Shamseer K

4,964
2
25
43

Sorry, I need to have it inside so that row has the form. – maxshuty Sep 13 '16 at 17:53
you have one column column editable in every row right ? – Shamseer K Sep 13 '16 at 17:54

score 0 · Answer 3 · edited May 05 '22 at 16:14

Since no answer was reported for testing the for loop instead of foreach.

I was stuck all day yesterday using foreach loop and always got 0 items in the post method. I changed to for loop and was able to receive the updated items in the post method.

For reference I am using asp.net core 3.2

This is the foreach loop:

     @{         
               foreach(var role in @Model.RolesList)
                {
                    <div class="btn-check m-1">
                    <input type="hidden" asp-for="@role.RoleId" />
                     <input type="hidden" asp-for="@role.RoleName" />
                     <input  asp-for="@role.IsSelected" class="form-check-input" />
                    <label class="form-check-label" asp-for="@role.IsSelected">@role.RoleName</label>
                     </div>
                }
            }

This is the for loop:

  @for(int i = 0;i< Model.`enter code here`RolesList.Count();i++)
            {
                  <div class="btn-check m-1">
                    <input type="hidden" asp-for="RolesList[i].RoleId" />
                     <input type="hidden" asp-for="RolesList[i].RoleName" />
                     <input  asp-for="RolesList[i].IsSelected" class="form-check-input" />
                    <label class="form-check-label" asp-for="RolesList[i].IsSelected">@Model.RolesList[i].RoleName</label>
                     </div>

            }

also the RolesList is defined as an IEnumerable – Ayman May 05 '22 at 11:56 — Ayman, May 05 '22 at 11:56

Form within a foreach loop not posting the model back to the controller

3 Answers3