You can use EditorTemplates to handle this. Here is a working sample.
So i have a viewmodel to represent the father-child relationship
public class PersonVM
{
public int Id { set; get; }
public string Name { set; get; }
public int? ParentId { set; get; }
public List<PersonVM> Childs { set; get; }
}
And in my GET action method, i create an object of my view model and load the Father -childs data to it.
public ActionResult EditorTmp(int id = 1)
{
//Hard coded for demo, you may replace with actual DB values
var person = new PersonVM {Id = 1, Name = "Mike"};
person.Childs = new List<PersonVM>
{
new PersonVM {Id = 2, Name = "Scott", ParentId = 11},
new PersonVM {Id = 2, Name = "Gavin", ParentId = 12}
};
return View(person);
}
Now i will create an EditorTemplate. To do that, Go to your Views folder, and Create a directory called EditorTemplates under the directory which has same name as the controller, and add a view with name PersonVM.cshtml
![enter image description here](https://i.stack.imgur.com/Q8vCl.png)
Now, go to this view and add the below code.
@model ReplaceWithYourNameSpaceNameHere.PersonVM
<div>
<h4>Childs </h4>
@Html.TextBoxFor(s => s.Name)
@Html.HiddenFor(s => s.Id)
</div>
Now let's go back to our main view. We need to make this view strongly typed to our original PersonVM
. We will use the EditorFor html helper method in this view to call our editor template
@model ReplaceWithYourNameSpaceNameHere.PersonVM
@using (Html.BeginForm())
{
<div>
@Html.TextBoxFor(s => s.Name)
@Html.HiddenFor(s => s.Id)
</div>
@Html.EditorFor(s=>s.Childs)
<input type="submit"/>
}
Now have an HttpPost method in the controller to handle the form posting
[HttpPost]
public ActionResult EditorTmp(PersonVM model)
{
int fatherId = model.Id;
foreach (var person in model.Childs)
{
var id=person.Id;
var name = person.Name;
}
// to do : Save ,then Redirect (PRG pattern)
return View(model);
}
Now, If you put a break point in your HttpPost action method, you can see the Id's of childs are passed to this action method.
![enter image description here](https://i.stack.imgur.com/AMonl.png)
One important thing to remember is, Your Editor Template view's name should be same as the type you are binding to it.