Develop Reference

C# MVC, Link Together Nested Partial Views

In a C# MVC WebApp, I have a CallDetailViewModel that contains a list of CallerViewModels and it has a List of PhoneNumberViewModels. I'm trying to link them all together properly.
Not shown here, but I am also trying to both load existing values and add new/remove values, so I don't know what's being sent to the controller ahead of time.
I've tried following this 2012 guide that has a very similar problem I found online, but no luck yet: Code Project Article
I also tried moving the List of PhoneNumberViewModels to the CallDetailViewModel, and while I was able to pass the phone numbers to my controller I didn't have a clear way to link them to the appropriate CallerViewModel.
I want to be able to add and remove PhoneNumbers from Callers and Callers from the CallDetail.
I've removed my buttons and AJAX regarding those for now, as it's not my main problem.
Here are my simplified ViewModels and Views:
ViewModels
CallDetailViewModel.cs
namespace PROJECT_NAME.ViewModels
{
public class CallDetailsViewModel
{
public Guid Id { get; set; }
public string EnteredByEmail { get; set; }
public List<CallerViewModel> CallerViewModels { get; set; }
}
}
CallerViewModel.cs
namespace PROJECT_NAME.ViewModels
{
public class CallerViewModel
{
public Guid Id { get; set; }
public string FirstName { get; set; }
public List<PhoneNumberViewModel> PhoneNumberViewModels { get; set; }
}
}
PhoneNumberViewModel.cs
namespace PROJECT_NAME.ViewModels
{
public class PhoneNumberViewModel
{
public Guid Id { get; set; }
public string Number { get; set; }
}
}
Views
CallDetail.cshtml
#using PROJECT_NAME.ViewModels
#model CallDetailsViewModel
<div class="container">
#using (Html.BeginForm("SubmitCallDetails", "Home", FormMethod.Post))
{
#Html.AntiForgeryToken()
#Html.HiddenFor(m => m.Id)
<div class="well">
#* Call Details *#
<div class="row">
<fieldset">
<legend>Call Details</legend>
</fieldset>
<div class="form-group">
#Html.LabelFor(m => m.EnteredByEmail, new {#class = "control-label"})
#Html.TextBoxFor(m => m.EnteredByEmail, new {#class = "form-control"})
</div>
</div>
#* Caller Details *#
<div class="row">
<fieldset>
<legend>Callers</legend>
</fieldset>
</div>
#* Render each existing caller. Each caller gets it's own well to create a visual seperation between them. *#
#if (Model.CallerViewModels.Count == 0)
{
<div class="well">
#{ Html.RenderPartial("_PartialCallerInfo", new CallerViewModel());}
</div>
}
#foreach (var callerViewModel in Model.CallerViewModels)
{
<div class="well">
#{ Html.RenderPartial("_PartialCallerInfo", callerViewModel); }
</div>
}
</div>
<div class="row">
<div class="form-group">
<button class="btn btn-danger" type="reset">Reset</button>
</div>
<div class="form-group">
<button class="btn btn-primary" type="submit">Submit</button>
</div>
</div>
}
</div>
_PartialCallerInfo.cshtml
#using PROJECT_NAME.ViewModels
#model CallerViewModel
#using (Html.BeginCollectionItem("CallerViewModels"))
{
<div class="row">
#Html.HiddenFor(m => m.Id)
<div class="form-group">
#Html.LabelFor(m => m.FirstName, new { #class = "control-label" })
#Html.TextBoxFor(m => m.FirstName, new { #class = "form-control"})
</div>
</div>
#if (Model.PhoneNumberViewModels.Count == 0)
{
#{ Html.RenderPartial("_PartialCallerPhoneNumber", new PhoneNumberViewModel());}
}
#foreach (var phoneNumberViewModel in Model.PhoneNumberViewModels)
{
#{ Html.RenderPartial("_PartialCallerPhoneNumber", phoneNumberViewModel); }
}
}
_PartialCallerPhoneNumber.cshtml
#using PROJECT_NAME.ViewModels
#model PhoneNumberViewModel
#using (Html.BeginCollectionItem("PhoneNumberViewModels"))
{
<div class="row">
#Html.HiddenFor(m => m.Id)
<div class="form-group">
#Html.LabelFor(m => m.Number, new { #class = "control-label" })
#Html.TextBoxFor(m => m.Number, new { #class = "form-control"})
</div>
</div>
}

showing each table data row as a Label

I'm having following FinanceProductFeatures table , I want show each of this table record as label name for a form.
So I created model class like this
public class ProductFinanceFeatures
{
public IList<AB_FinanceProductFeatures> ListProductFinanceFields { get; set; }
}
public partial class AB_FinanceProductFeatures
{
public string ProductFinanceNameEn { get; set; }
public string ProductFinance_Value_EN { get; set; }
}
then Controller class like this
[HttpGet]
public ViewResult Financing_Product_Feature_Configuration()
{
var model = new ProductFinanceFeatures
{
ListProductFinanceFields = db.FinanceProductFeatures.ToList()
};
return View(model);
}
then Its viewpage like this
#model albaraka.Models.ProductFinanceFeatures
#{
}
#using (Html.BeginForm())
{
#Html.AntiForgeryToken()
<div class="form-horizontal">
#Html.ValidationSummary(true, "", new { #class = "text-danger" })
#for (int i = 0; i < Model.ListProductFinanceFields.Count; i++)
{
<div class="form-group">
#Html.LabelFor(model => model.ListProductFinanceFields[i].ProductFinanceNameEn, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.TextAreaFor(m => m.ListProductFinanceFields[i].ProductFinance_Value_EN, new { #row = 5 })
</div>
</div>
}
<div class="form-group">
<div class="col-md-offset-2 col-md-10">
<input type="submit" value="Save" class="btn btn-default" />
</div>
</div>
</div>
}
but here I'm not getting expected result, cannot render the Label
showing like this

Just simply replace TextAreaFor with DisplayFor as below-
<div class="col-md-10">
#Html.DisplayFor(m => m.ListProductFinanceFields[i].ProductFinance_Value_EN, new { #row = 5 })
</div>
Or
<div class="col-md-10">
#Html.DisplayTextFor(m => m.ListProductFinanceFields[i].ProductFinance_Value_EN)
</div>
Hope this works for you..!

Bind unknown number of Input elements to model in MVC5

I am fairly new to MVC5 and C# and I am trying to achieve something that I don't fully understand.
I have a Team Model such as this:
public class Team
{
[Key]
public Guid ID { get; set; }
public string TeamName { get; set; }
public string Coach { get; set; }
public string Conference { get; set; }
}
I also have a Player Model such as this:
public class Player
{
[Key]
public Guid Id { get; set; }
[ForeignKey("Teams")]
public Guid TeamId { get; set; }
public string Name { get; set; }
public virtual Team Teams { get; set; }
}
View Model is
public class TeamViewModel
{
public string TeamName { get; set; }
public string Coach { get; set; }
public string Conference { get; set; }
public List<Player> Players { get; set; }
}
With this structure, you are suppose to be able to add and infinite number of players to each team. As such I have a Teams table with few properties and a Player table that contains the player name as well as the player TeamId so that we know to what team they belong.
My problem comes when I am creating a team. I have Create Controller such as this:
[HttpPost]
[ValidateAntiForgeryToken]
public async Task<ActionResult> Create(TeamViewModel model)
{
if (ModelState.IsValid)
{
var team = new Team { TeamName = model.TeamName, Coach = model.Coach, Conference = model.Conference, Player = model.Player };
db.Teams.Add(team);
var result = await db.SaveChangesAsync();
return RedirectToAction("Index");
}
return View();
}
And my View is as follows:
#model SoccerTeams.Models.ViewModels.TeamViewModel
#{
ViewBag.Title = "Create";
}
<h2>Create</h2>
#using (Html.BeginForm())
{
#Html.AntiForgeryToken()
<div class="form-horizontal">
<h4>Team</h4>
<hr />
#Html.ValidationSummary(true, "", new { #class = "text-danger" })
<div class="form-group">
#Html.LabelFor(model => model.TeamName, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.TeamName, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.TeamName, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.Coach, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.Coach, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.Coach, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.Conference, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.Conference, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.Conference, "", new { #class = "text-danger" })
</div>
</div>
#if (#Model != null)
{
foreach (var p in Model.Player)
{
<div class="form-group">
#Html.Raw("<label class=\"control-label col-md-2\">" + p.ToString() + "</label>")
<div class="col-md-10">
#Html.Raw("<input class=\"form-control text-box single-line\" name=\"Player\" type-\"text\"")
</div>
</div>
}
}
else
{
<div class="form-group">
#Html.Raw("<label class=\"control-label col-md-2\">Player</label>")
<div class="col-md-10">
#Html.Raw("<input class=\"form-control text-box single-line\" name=\"Player\" type-\"text\"")
</div>
</div>
}
<div class="form-group">
<div class="col-md-offset-2 col-md-10">
<input type="submit" value="Create" class="btn btn-default" />
</div>
</div>
</div>
}
<div>
#Html.ActionLink("Back to List", "Index")
</div>
#section Scripts {
#Scripts.Render("~/bundles/jqueryval")
}
From my understanding, the View is suppose to be able to convert the input element to a list and pass it on to my ViewModel. However, my ViewModel is always coming up as null.
What am I missing and how would I make this work?
P.S. I understand that I can user Html.EditorFor, but I was not able to get it working, so I just printed it out as Html as I need to solve my other problem first.
Edit
I have altered my View to have the following code
<div class="form-group">
#Html.Raw("<label class=\"control-label col-md-2\">Player</label>")
<div class="col-md-10">
#Html.Raw("<input class=\"form-control text-box single-line\" name=\"model.Players[0].Name\" type-\"text\"")
</div>
</div>
As a result, the model now properly populates the Players Array, however all other values have now become null. If I remove the input element, the values are populated but players array is null again as there are no form fields for it. Do you know what could be the culprit?
In the TeamViewModel I have also renamed Player to Players.

In order for MVC to bind your form data to the Action method's parameters
their names should match.
Supposing your ViewModel has property for List<Player> Players your code should be:
In your case:
foreach (var p in Model.Player)
{
<div class="form-group">
#Html.Raw("<label class=\"control-label col-md-2\">" + p.ToString() + "</label>")
<div class="col-md-10">
#Html.Raw("<input class=\"form-control text-box single-line\" name=\"Player\" type-\"text\"")
</div>
</div>
}
Should be:
for (int i = 0; i < Model.Player.Length; i++)
{
<div class="form-group">
#Html.Raw("<label class=\"control-label col-md-2\">" + p.ToString() + "</label>")
<div class="col-md-10">
#Html.Raw("<input class=\"form-control text-box single-line\" name=\"model.Player[" + i + "].Name\" type-\"text\"")
</div>
</div>
}
Because this is the name of the parameter that you have provided:
Create(TeamViewModel model)
Also be careful because the indexes should not be broken, which means that they should be 0, 1, 2.. etc. without skipping a number.
The way that we read in the properties is by looking for
parameterName[index].PropertyName. The index must be zero-based and
unbroken.
NOTE You can read more about binding collections in Scott Hanselman's post - here
And last I suggest if you have a property that is list of something - in your case list of Player to use the plural form for the property name - Players.
EDIT
Try removing the "model." in front in the name. Make it like this "Players[0].Name". Since you only have one parameter in your Create Action method it should be fine.

I suggest you to use the helper #Html.EditorFor, so to do this you will create a partial view that will be used as template to inputs of the nested property. see the example:
Shared/EditorTemplates/Player.cshtml
#model Player
<div class="form-group">
#Html.HiddenFor(e => e.Id)
#Html.HiddenFor(e => e.TeamId)
<label class="control-label col-md-2" for="player">Player</label>
<div class="col-md-10">
#Html.TextBoxFor(e => e.Name, new { #class = "form-control text-box single-line", id = "player", name = "Player"})
</div>
</div>
Players form on Team view:
#Html.EditorFor(e => e.Player)
Instead of:
foreach (var p in Model.Player)
{
<div class="form-group">
#Html.Raw("<label class=\"control-label col-md-2\">" + p.ToString() + "</label>")
<div class="col-md-10">
#Html.Raw("<input class=\"form-control text-box single-line\" name=\"Player\" type-\"text\"")
</div>
</div>
}
See this article for more information about editor templates: Editor and display templates

ASP.NET MVC4 IEnumerable empty on post

I have read several answers on this issue but despite this, it would appear I have developed code blindness.
I have the following view model:
public class IndividualProductVm
{
public virtual Products Products { get; set; }
public ProductSummary ProductSummary { get; set; }
public virtual IEnumerable<ProductSimpleResponse> ProductSimpleResponse { get; set; }
}
This is then passed into a view and then a partial view:
#model Websites.ViewModels.IndividualProductVm #{ ViewBag.Title = "Edit"; }
<h2>Edit</h2>
#using (Html.BeginForm(null, null, FormMethod.Post, new { name = "form", id = "mainForm" })) { #Html.AntiForgeryToken() #Html.ValidationSummary(true, "", new { #class = "text-danger" }) #Html.HiddenFor(model => model.Products.Id) #Html.HiddenFor(model
=> model.ProductSummary.SupplierId) Html.RenderPartial("_IndividualProduct", Model);
<div class="form-group">
<div class="col-md-offset-2 col-md-10">
<input type="submit" value="Save" class="btn btn-default" />
</div>
</div>
}
<div>
#Html.ActionLink("Back to List", "Index", new { id = Model.ProductSummary.SupplierId }, new { #class = "btn btn-default" })
</div>
#section Scripts { #Scripts.Render("~/bundles/jqueryval") }
#model Websites.ViewModels.IndividualProductVm
<div>
#Html.LabelFor(model => model.Products.ProductCode, htmlAttributes: new { #class = "control-label col-md-2" })
<div>
#Html.DisplayFor(model => model.Products.ProductCode, new { htmlAttributes = new { #class = "form-control" } })
</div>
</div>
<div style="clear:both;"></div>
<div>
#Html.LabelFor(model => model.Products.ProductDescription, htmlAttributes: new { #class = "control-label col-md-2" })
<div>
#Html.DisplayFor(model => model.Products.ProductDescription, new { htmlAttributes = new { #class = "form-control" } })
</div>
</div>
<table class="table">
<tr>
<th>
Present
</th>
</tr>
#foreach (var item in Model.ProductSimpleResponse)
{
<tr>
#Html.HiddenFor(modelItem => item.Id)
#Html.HiddenFor(modelItem => item.SupplierId)
#Html.HiddenFor(modelItem => item.ProductCode)
<td>
#Html.EditorFor(modelItem => item.Present)
</td>
</tr>
}
</table>
However, when I enter the edit post, my viewmodel is null for the IEnumerable<ProductSimpleResponse> but fine for the other two classes.
[HttpPost]
[ValidateAntiForgeryToken]
public ActionResult Edit(IndividualProductVm model)
{
if (ModelState.IsValid)
{
return RedirectToAction("Index", new { id = model.ProductSummary.SupplierId });
}
return View(model.Products);
}
If someone can explain what I'm doing wrong, I'd be most grateful.

Your property name is ProductSimpleResponse, alhtough the type is ProductSvhcSimpleResponse, so to iterate through it you should have.
#foreach (var item in Model.ProductSimpleResponse)
NOT
#foreach (var item in Model.ProductSvhcSimpleResponse)

use List because
IEnumerable is suitable just for iterate through collection and you can not modify (Add or Remove) data IEnumerable bring ALL data from server to client then filter them, assume that you have a lot of records so IEnumerable puts overhead on your memory.
public class IndividualProductVm
{
public virtual Products Products { get; set; }
public ProductSummary ProductSummary { get; set; }
public virtual List<ProductSvhcSimpleResponse> ProductSimpleResponse { get; set; }
}
More help click here

MVC5 ModelView is not valid on post of edit action

I have an MVC5 project with Entity 6 framework and I am having trouble getting the correct information passed to the edit action on the post, in order to bind it to the models. The ModelState of my viewModel comes back as invalid. I am not sure what I am missing. I am guessing that it has to do with the way that my Editor templates are setup vs the structure of my models but I need some help figuring it out. I have spent many hours changing things to try and get this working and I still cant get it corrected.
My ViewModel:
namespace CommunityHealth.Models.ViewModels
{
public class ActivityViewModel
{
public virtual IList<JunctionTypeAction> junctionTypeActions{ get; set; }
public virtual IList<JunctionDepartmentAction> junctionDepartmentActions{ get; set; }
public virtual IList<JunctionPopulationAction> junctionPopulationActions { get; set; }
public virtual CommunityAction Action { get; set; }
}
}
The Community Action Model:
public partial class CommunityAction
{
public CommunityAction()
{
this.JunctionPopulationActions = new HashSet<JunctionPopulationAction>();
this.JunctionDepartmentActions = new HashSet<JunctionDepartmentAction>();
this.JunctionTypeActions = new HashSet<JunctionTypeAction>();
}
public int ActionID { get; set; }
public System.DateTime StartDate { get; set; }
public Nullable<System.DateTime> EndDate { get; set; }
public string BreifDescription { get; set; }
public Nullable<int> Duration { get; set; }
public int LocationID { get; set; }
public string SubLocation { get; set; }
public int ProgramID { get; set; }
public string Notes { get; set; }
public string AddedBy { get; set; }
public byte[] RecordVersion { get; set; }
public virtual Location Location { get; set; }
public virtual Program Program { get; set; }
public virtual ICollection<JunctionPopulationAction> JunctionPopulationActions { get; set; }
public virtual ICollection<JunctionDepartmentAction> JunctionDepartmentActions { get; set; }
public virtual ICollection<JunctionTypeAction> JunctionTypeActions { get; set; }
}
The Models for the Junction Tables:
JunctionDepartmentAction:
public partial class JunctionDepartmentAction
{
public int IndexID { get; set; }
public int DepartmentID { get; set; }
public int ActionID { get; set; }
public string SubDepartment { get; set; }
public int Individuals { get; set; }
public virtual CommunityAction CommunityAction { get; set; }
public virtual Department Department { get; set; }
}
JunctionPopulationAction:
public partial class JunctionPopulationAction
{
public int IndexID { get; set; }
public int PopulationID { get; set; }
public int ActionID { get; set; }
public bool isActive { get; set; }
public virtual CommunityAction CommunityAction { get; set; }
public virtual TargetPopulation TargetPopulation { get; set; }
}
JunctionTypeAction:
public partial class JunctionTypeAction
{
public int IndexID { get; set; }
public int TypeID { get; set; }
public int ActionID { get; set; }
public virtual ActivityType ActivityType { get; set; }
public virtual CommunityAction CommunityAction { get; set; }
}
Event Controller Edit Action Methods:
// GET: /Event/Edit/5
public async Task<ActionResult> Edit(int? id)
{
if (id == null)
{
return new HttpStatusCodeResult(HttpStatusCode.BadRequest);
}
CommunityAction communityaction = await db.CommunityActions.FindAsync(id);
ActivityViewModel activityviewmodel = new ActivityViewModel();
activityviewmodel.Action = communityaction;
IList<JunctionTypeAction> junctiontypeactions = await db.JunctionTypeActions.Where(d => d.ActionID == communityaction.ActionID).ToListAsync();
IList<JunctionDepartmentAction> junctiondepartmentactions = await db.JunctionDepartmentActions.Where(d => d.ActionID == communityaction.ActionID).ToListAsync();
IList<JunctionPopulationAction> junctionpopulationactions = await db.JunctionPopulationActions.Where(d => d.ActionID == communityaction.ActionID).ToListAsync();
activityviewmodel.junctionTypeActions = junctiontypeactions.ToList();
activityviewmodel.junctionDepartmentActions = junctiondepartmentactions.ToList();
activityviewmodel.junctionPopulationActions = junctionpopulationactions.ToList();
if (communityaction == null)
{
return HttpNotFound();
}
ViewBag.LocationID = new SelectList(db.Locations, "LocationID", "LocationName", activityviewmodel.Action.LocationID);
ViewBag.ProgramID = new SelectList(db.Programs, "ProgramID", "ProgramID", activityviewmodel.Action.ProgramID);
return View(activityviewmodel);
}
[HttpPost]
[ValidateAntiForgeryToken]
public async Task<ActionResult> Edit(ActivityViewModel activity)
{
//request added for debugging purposes
Request.ToString();
if (ModelState.IsValid)
{
db.Entry(activity).State = EntityState.Modified;
await db.SaveChangesAsync();
return RedirectToAction("Index");
}
ViewBag.LocationID = new SelectList(db.Locations, "LocationID", "LocationName", activity.Action.LocationID);
ViewBag.ProgramID = new SelectList(db.Programs, "ProgramID", "ProgramID", activity.Action.ProgramID);
return View(activity);
}
And finally my Views. I am using three editor templates for the junction tables in the DataBase and one more for the CommunityAction object. I then have a view for the event that uses the three editor templates to display the parts of the ViewModel.
CommunityAction.cshtml:
#model CommunityHealth.Models.CommunityAction
<div class="form-horizontal">
<h4>CommunityAction</h4>
<hr />
#Html.ValidationSummary(true)
#Html.HiddenFor(model => model.ActionID)
#Html.HiddenFor(model => model.RecordVersion)
<div class="form-group">
#Html.LabelFor(model => model.StartDate, new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.StartDate)
#Html.ValidationMessageFor(model => model.StartDate)
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.EndDate, new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.EndDate)
#Html.ValidationMessageFor(model => model.EndDate)
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.BreifDescription, new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.BreifDescription)
#Html.ValidationMessageFor(model => model.BreifDescription)
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.Duration, new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.Duration)
#Html.ValidationMessageFor(model => model.Duration)
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.LocationID, "Location", new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.DropDownListFor(model => model.Location, ViewBag.LocationID as SelectList, new { htmlAttributes = new { #class = "control-form" } })
#Html.ValidationMessageFor(model => model.Location)
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.SubLocation, new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.SubLocation)
#Html.ValidationMessageFor(model => model.SubLocation)
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.ProgramID, "Program", new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.DropDownListFor(model => model.ProgramID, ViewBag.ProgramID as SelectList, new { htmlAttributes = new { #class = "control-form" } })
#Html.ValidationMessageFor(model => model.Program)
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.Notes, new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.Notes)
#Html.ValidationMessageFor(model => model.Notes)
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.AddedBy, new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.AddedBy)
#Html.ValidationMessageFor(model => model.AddedBy)
</div>
</div>
<div class="form-group">
<div class="col-md-10">
</div>
</div>
</div>
JunctionTypeAction.cshtml:
#model CommunityHealth.Models.JunctionTypeAction
<div class="type">
<fieldset>
#Html.HiddenFor(model => model.ActionID)
#Html.HiddenFor(model => model.IndexID)
#Html.EditorFor(model => model.TypeID, "TypeName", new { #class = "control-label col-md-2" })
</fieldset>
</div>
JunctionDepartmentAction.cshtml:
#model CommunityHealth.Models.JunctionDepartmentAction
#using CommunityHealth.Models
<div>
<table>
<tbody>
<tr>
<td>
#Html.HiddenFor(model => model.ActionID)
#Html.HiddenFor(model => model.IndexID)
#Html.EditorFor(model => model.DepartmentID, "DepartmentName", new { #class = "control-label col-md-2" })
</td>
<td>
#Html.EditorFor(model => model.SubDepartment, "SubDepartment", new { #class = "control-label col-md-2 " })
</td>
<td>
#Html.EditorFor(model => model.Individuals)
</td>
</tr>
</tbody>
</table>
</div>
JunctionPopulationAction.cshtml:
#model CommunityHealth.Models.JunctionPopulationAction
<div class="population">
<fieldset>
#Html.HiddenFor(model => model.ActionID)
#Html.HiddenFor(model => model.IndexID)
#Html.EditorFor(model => model.PopulationID, "PopulationName", new { #class = "control-label col-md-2" })
</fieldset>
</div>
Views\Event\Edit.cshtml:
#model CommunityHealth.Models.ViewModels.ActivityViewModel
#using CommunityHealth.Models.ViewModels;
#{
ViewBag.Title = "Edit";
}
<h2>Edit</h2>
#using (Html.BeginForm("Edit","Event",FormMethod.Post))
{
#Html.AntiForgeryToken()
<div>
<div class="form-group">
#Html.EditorFor(model => model.Action)
</div>
<div class="form-group">
#Html.Label("Types")
<div class="col-md-10">
<fieldset>
#for (int x = 0; x < Model.junctionTypeActions.Count(); x++)
{
#Html.EditorFor(model => model.junctionTypeActions[x])
}
</fieldset>
</div>
</div>
<div class="form-group">
#Html.Label("Departments")
<div class="col-md-10">
#for (int x = 0; x < Model.junctionDepartmentActions.Count(); x++)
{
#Html.EditorFor(model => model.junctionDepartmentActions[x])
}
</div>
</div>
<div class="form-group">
#Html.Label("Target Populations")
<div class="col-md-10">
#for (int x = 0; x < Model.junctionDepartmentActions.Count(); x++)
{
#Html.EditorFor(model => model.junctionPopulationActions[x])
}
</div>
</div>
<div class="form-group">
<div class="col-md-offset-2 col-md-10">
<input type="submit" value="Save" class="btn btn-default" />
</div>
</div>
</div>
<div>
#Html.ActionLink("Back to List", "Index")
</div>
}
#section Scripts {
#Scripts.Render("~/bundles/jqueryval")
}
I am getting this error when I examine the request:
"The parameter conversion from type 'System.String' to type 'CommunityHealth.Models.CommunityAction' failed because no type converter can convert between these types."

The reason for that error is because you model has a property named activity (typeof CommunityAction), and the parameter of your post method is also named activity. Change the parameter name to anything other than the name of a property in the model(s)
public async Task<ActionResult> Edit(ActivityViewModel model)
{
....
}
Side notes
Simply use #Html.EditorFor(m => m.junctionTypeActions) to generate
the html for collections (not in a for loop). #Html.EditorFor()
is smart enough to recognize collections and generate the correct
html.
Generating all those hidden inputs is bad practice and degrades
performance (and any malicious user could change the values anyway).
Use view models for each or your types that contain only the
properties you need to display/edit.