Loading related data in Entity Framework Core and ASP.NET Core

asp.net asp.net-core asp.net-mvc c# entity-framework-core

Question

I'm trying to load related data with Include() but I think I'm doing something wrong.

I want to load the shoe's images on this table and the images for practice purposes in one row, but when I add the CrateImages.ImageURL (to give an example) I get an error CS1061 and I'm not able to show the data from the Include().

I have an index page:

@model IEnumerable<Shoes.Data.Entities.ShoeEntity>

<p>
    <a asp-action="Create">Create New</a>
</p>
<table class="table">
    <thead>
        <tr>
            <th>
                @Html.DisplayNameFor(model => model.Name)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.Title)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.Description)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.ShoesImages)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.Price)
            </th>
            <th></th>
        </tr>
    </thead>
    <tbody>
    @foreach (var item in Model) {
        <tr>
            <td>
                @Html.DisplayFor(modelItem => item.Name)
            </td>
            <td>
                @Html.DisplayFor(modelItem => item.Title)
            </td>
            <!--- This is the problem too --->
            <td>
                @Html.DisplayFor(modelItem => item.ShoesImages.ImageURL)
            </td>

            <td>
                @Html.DisplayFor(modelItem => item.Price)
            </td>
            <td>
                <a asp-action="Edit" asp-route-id="@item.Id">Edit</a> |
                <a asp-action="Details" asp-route-id="@item.Id">Details</a> |
                <a asp-action="Delete" asp-route-id="@item.Id">Delete</a>
            </td>
        </tr>
}
    </tbody>
</table>

Index controller:

public IActionResult Index()
{
     var data = _context.Shoes.Include(ci => ci.ShoeImages);
     return View(data);
}

Shoe entity:

public class ShoeEntity
{
     public string Id { get; set; }
     public string Name { get; set; }
     public ICollection<ShoeImageEntity> ShoeImages { get; set; }
}

ShoeImages entity:

public class ShoeImageEntity
{
    public string Id { get; set; }
    public string ImageURL { get; set; }

    public string ImageFullPath => 
            string.IsNullOrEmpty(ImageURL) ? null : $"https://localhost:44357{ImageURL.Substring(1)}";

    public ShoeEntity Shoe { get; set; }
}

Context class:

public class DataContext : IdentityDbContext<UserEntity, RoleEntity, string>
{
     public DbSet<ShoeEntity> Shoes{ get; set; }
     public DbSet<ShoeImagesEntity> ShoesImages { get; set; }     

     public DataContext(DbContextOptions options) : base(options)
     {
     }
}

Also I tried the Entity Framework documentation.

1
-1
3/4/2020 5:11:29 AM

Accepted Answer

Your ShoeImages filed corresponds to multiple ImageURL fields because it is of type ICollection.

You can use the following view code to show them.

@model IEnumerable<Shoes.Data.Entities.ShoeEntity>
<p>
    <a asp-action="Create">Create New</a>
</p>
<table class="table">
    <thead>
        <tr>
            <th>
                @Html.DisplayNameFor(model => model.Name)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.Title)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.Description)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.ShoesImages)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.Price)
            </th>
            <th></th>
        </tr>
    </thead>
    <tbody>
        @foreach (var item in Model)
        {
            foreach (var images in item.ShoeImages)
            {
                <tr>
                    <td>
                        @Html.DisplayFor(modelItem => item.Name)
                    </td>
                    <td>
                        @Html.DisplayFor(modelItem => item.Title)
                    </td>
                    <td>
                        @Html.DisplayFor(modelItem => images.ImageURL)
                    </td>
                    <td>
                        @Html.DisplayFor(modelItem => item.Price)
                    </td>
                    <td>
                        <a asp-action="Edit" asp-route-id="@item.Id">Edit</a> |
                        <a asp-action="Details" asp-route-id="@item.Id">Details</a> |
                        <a asp-action="Delete" asp-route-id="@item.Id">Delete</a>
                    </td>
                </tr>
            }

        }
    </tbody>
</table>

1
3/4/2020 3:22:59 AM

Popular Answer

Thanks everyone for the help. If I had done it alone I would not have noticed. I check the answer as correct. I'll make an edit because both foreach requires @ before every foreach

@model IEnumerable<Shoes.Data.Entities.ShoeEntity>
<p>
    <a asp-action="Create">Create New</a>
</p>
<table class="table">
    <thead>
        <tr>
            <th>
                @Html.DisplayNameFor(model => model.Name)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.Title)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.Description)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.ShoesImages)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.Price)
            </th>
            <th></th>
        </tr>
    </thead>
    <tbody>
        @foreach (var item in Model)
        {
            @foreach (var images in item.ShoeImages)
            {
                <tr>
                    <td>
                        @Html.DisplayFor(modelItem => item.Name)
                    </td>
                    <td>
                        @Html.DisplayFor(modelItem => item.Title)
                    </td>
                    <td>
                        @Html.DisplayFor(modelItem => images.ImageURL)
                    </td>
                    <td>
                        @Html.DisplayFor(modelItem => item.Price)
                    </td>
                    <td>
                        <a asp-action="Edit" asp-route-id="@item.Id">Edit</a> |
                        <a asp-action="Details" asp-route-id="@item.Id">Details</a> |
                        <a asp-action="Delete" asp-route-id="@item.Id">Delete</a>
                    </td>
                </tr>
            }

        }
    </tbody>
</table>



Related Questions





Related

Licensed under: CC-BY-SA with attribution
Not affiliated with Stack Overflow
Licensed under: CC-BY-SA with attribution
Not affiliated with Stack Overflow