Reputation:
I am working on my MVCOnlineShop
Project, i made a product list page, now i want to show an image for each product, so i made an image
table in SQL
, in it imageID
and imagepath
, and in the product
table i added imageID
, i have searched on how to fetch the images from the database , but didn't understand that much, so can you please help me with my actionresult
in my controller
?
this is my productList
PartialView
:
@model MVCOnlineShop.Models.Category
@{
ViewBag.Title = "ProductList";
}
<script src="~/Scripts/Productjs/bootstrap.min.js"></script>
<script src="~/Scripts/Productjs/jquery.js"></script>
<link href="~/Content/Productcss/bootstrap.min.css" rel="stylesheet">
<link href="~/Content/Productcss/2-col-portfolio.css" rel="stylesheet">
<div class="container">
<!-- Page Header -->
<div class="row">
@foreach (var Product in Model.Products)
{
<div class="col-md-6 portfolio-item">
<a href="#">
<img class="img-responsive" src="http://placehold.it/700x400" alt="">
</a>
<h3>
<a href="#">@Html.ActionLink(Product.ProductName, "Details", new { id = Product.CategoryID })</a>
</h3>
</div>
}
</div>
</div>
this view will show each product but with the same image, i want to change it to get the images in database.
Thanks in advance :)
Upvotes: 1
Views: 72
Reputation: 39348
Assuming every product has at least one image (otherwise you need to check for it's existence), and you use lazy loading in your EF model (otherwise you will need to "Include" the Images property) change this:
<img class="img-responsive" src="http://placehold.it/700x400" alt="">
into this:
<img class="img-responsive" src="@Product.Images.First().Imagepath" alt="">
You may need to change the spelling of the various properties, I had to guess at them.
Upvotes: 1