master detail - ASP.NET MVC example of editing multiple child records

Question

Does anyone know of any examples or tutorials of an MVC view that shows parent/child data all on one form, and allows all the child records to be editable?

For example, say I have a table of people and another containing the vehicles they own. One one form, I want to show every vehicle for a given person, and make the data elements editable (i.e. license plate number, car color, etc.) in case there are mistakes. I don't want to jump to a separate edit form for each vehicle.

My attempts thus far have gotten me to the point where I can display the data, but I can't get it to post back to the controller. I've tried to narrow down the problem as far as I could here, but I'm still not getting it, and I think a broader example may be in order. Any ideas?

Answer 1

You can try something like this.

Suppose you have this object :

public class Vehicle
{
    public int VehicleID { get; set; }
    public string LicencePlate { get; set; }
    public string Color { get; set; }
}

And this is your controller action that you'll use to edit vehicle details (where you'll post the form) :

[AcceptVerbs(HttpVerbs.Post)]
public ActionResult EditVehicles(int Owner, Vehicle[] vehicles)
{
    //manipulate the data, then return back to the list
    return RedirectToAction("YourAction");
}

Then you should set your form this way :

<!--have a form for each person, listing their vehicles-->
<form action="/EditVehicles" method="post">
    <input type="hidden" name="Owner" value="25" />
    <input type="hidden" name="Vehicles[0].VehicleID" value="10" />
    <input type="text" name="Vehicles[0].LicencePlate" value="111-111" />
    <input type="text" name="Vehicles[0].Color" value="Red" />
    <input type="hidden" name="Vehicles[1].VehicleID" value="20" />
    <input type="text" name="Vehicles[1].LicencePlate" value="222-222" />
    <input type="text" name="Vehicles[1].Color" value="Blue" />
    <input type="submit" value="Edit" />
</form>

This will help the DefaultModelBinder to correctly bind the form data to your model in your controller. Thus Response.Write(vehicles[1].Color); on your controller, will print "Blue".

This is a very simple example, but I'm sure you get the idea. For more examples about binding forms to arrays, lists, collections, dictionaries, take a look at here.