How to get related data with many-to-many relationship table? - asp.net-core

Question

I have three tables. The first one is Movie, the second one Category, and the third one MovieCategory. I listed movies, but I want to choose a category and then list the movies for each category.
How do I make the controller? I've included my business objects, view, and current controller below.
Movie Entity
public class Movie : IEntity
{
public int Id { get; set; }
public string Name { get; set; }
public string Summary { get; set; }
public string Director { get; set; }
public string Banner { get; set; }
public ICollection<MoviesCategory> MoviesCategory { get; set; }
}
Category Entity
public class Category : IEntity
{
public int Id { get; set; }
public string CategoryName { get; set; }
public ICollection<MoviesCategory> MoviesCategory { get; set; }
}
MovieCategory Entity
public class MoviesCategory : IEntity
{
public int Id { get; set; }
public int MovieId { get; set; }
public int CategoryId { get; set; }
public Category Category { get; set; }
public Movie Movie { get; set; }
}
Controller
public IActionResult List()
{
var movies = _movieService.GetAll();
MovieListViewModel movieListViewModel = new MovieListViewModel()
{
Movies = movies
};
return View(movieListViewModel);
}
View
#foreach (var item in Model.Movies)
{
<tr>
#Html.HiddenFor(modelItem => item.Id)
<td>
#Html.DisplayFor(modelItem => item.Id)
</td>
<td>
#Html.DisplayFor(modelItem => item.Name)
</td>
<td>
#if (!string.IsNullOrEmpty(item.Summary) && item.Summary.Length > 35)
{
<p>#(item.Summary.Substring(0,35))</p>
}
</td>
<td>
#Html.DisplayFor(modelItem => item.Director)
</td>
<td>
<img src="~/images/#item.Banner" width="105" height="140" class="img-thumbnail" />
</td>
<td>
<i title="Edit" class="fas fa-edit" style="color:coral"></i>
<i title="Detail" class="fas fa-info-circle" style="color:cornflowerblue"></i>
<td>
<tr>
}

Answer 1

In order to get a Category and its related Movies do the following:
Create a view model that holds the data for Category and Movies in order to have a strongly typed view:
public class MovieData
{
public Category Category { get; set; }
public IEnumerable<Movies> Movies { get; set; }
}
Then in your controller you query the database like this:
public async Task<IActionResult> MovieDataAction(int catId)
{
var data = await context
.Categories
.Where(c => c.Id == catId) //Category Id
.Include(c => c.MoviesCategory)
.ThenInclude(p => p.Movie)
.Select(cat => new { Category = cat, Movies = cat.MoviesCategory.Select(w => w.Movie) })
.FirstOrDefaultAsync();
var vData = new MovieData(){
Category = data.Category,
Movies = data.Movies
};
return View(vData);
}

Answer 2

I made a demo based on your description like below:
View:
#model MovieListViewModel
#{
ViewData["Title"] = "List";
}
<h1>List</h1>
#Html.DropDownListFor(modelItem => modelItem.CategoryId, Model.Categories, "Select Category",
new { #class = "form-control" })
<table>
#foreach (var item in Model.Movies)
{
<tr>
#Html.HiddenFor(modelItem => item.Id)
<td>
#Html.DisplayFor(modelItem => item.Id)
</td>
<td>
#Html.DisplayFor(modelItem => item.Name)
</td>
<td>
#if (!string.IsNullOrEmpty(item.Summary) && item.Summary.Length > 35)
{
<p>#(item.Summary.Substring(0,35))</p>
}
</td>
<td>
#Html.DisplayFor(modelItem => item.Director)
</td>
<td>
<i title="Edit" class="fas fa-edit" style="color:coral"></i>
<i title="Detail" class="fas fa-info-circle" style="color:cornflowerblue"></i>
<td>
</tr>
}
</table>
#section scripts{
<script>
$("#CategoryId").on("change", function () {
var id = $(this).val();
window.location.href = "/Movie/List?id=" + id;
})
</script>
}
Controller:
public IActionResult List(int? id)
{
var movies = _context.Movies.ToList();
var categories = _context.Categories.ToList();
if(id != null)
{
movies = _context.MoviesCategories.Where(c => c.CategoryId == id).Select(m => m.Movie).ToList();
}
MovieListViewModel movieListViewModel = new MovieListViewModel()
{
CategoryId = id ?? 0,
Categories = new List<SelectListItem>(),
Movies = movies
};
foreach(var category in categories)
{
movieListViewModel.Categories.Add(new SelectListItem { Text = category.CategoryName, Value = category.Id.ToString() });
}
return View(movieListViewModel);
}
Result: