How to use multiple form elements in ASP.NET MVC

Question

So I am new to ASP.NET MVC and I would like to create a view with a text box for each item in a collection. How do I do this, and how do I capture the information when it PO

Answer 1

You can do this:

@for (int i = 0; i < Model.Guests.Count; i++) {
  @Html.TextBoxFor(m => m.Guests.ToList()[i].FirstName)
}

There are more examples and details on this post by Haacked.

UPDATE: The controller post action should look like this:

[HttpPost]
public ActionResult Index(Room room)
{
    return View();
}

In this example I'm considering that you have a Room class like this:

public class Room
{
    public List<Guest> Guests { get; set; }
}

That's all, on the post action, you should have the Guests list correctly populated.

Answer 2

Definitely a job for an editor template. So in your view you put this single line:

@Html.EditorFor(x => x.Guests)

and inside the corresponding editor template (~/Views/Shared/EditorTemplates/Guest.cshtml)

@model AppName.Models.Guest
<div>
    First Name:<br />
    @Html.TextBoxFor(x => x.FirstName)
</div>

And that's about all.

Now the following actions will work out of the box:

public ActionResult Index(int id)
{
    SomeViewModel model = ...
    return View(model);
}

[HttpPost]
public ActionResult Index(SomeViewModel model)
{
    if (!ModelState.IsValid)
    {
        return View(model);
    }
    // TODO: do something with the model your got from the view
    return RedirectToAction("Success");
}

Note that the name of the editor template is important. If the property in your view model is:

public IEnumerable<Guest> Guests { get; set; }

the editor template should be called Guest.cshtml. It will automatically be invoked for each element of the Guests collection and it will take care of properly generating ids and names of your inputs so that when you POST back everything works automatically.

Conclusion: everytime you write a loop (for or foreach) inside an ASP.NET MVC view you should know that you are doing it wrong and that there is a better way.