CODEWITHSUNDEEP
asp.net-mvc
Sharp
Sharp

Reputation: 121

understanding Asp .net MVC basic concept

i am trying to display products with pictures but i've got a problem to display images,i think there is a lot i don't understand

i am lost in the middle of those 2 steps ,normally the way my view is written i expected to be able to display at the least the default pictures ,the first one in the list of media that every product must have

when i put a breakpoint in my home controller i can see that every product has a mediaId but i don't know where and how to add pictures to the list of medium so without surprise the list is empty and there is no image in any of my product

my HomeController

public ActionResult Index(string searchString)
    {
        var products = from p in dc.Products
                       select p;

       ....
        return View(products);
    }

this is my HomeIndex

@foreach (var p in Model)
    {
        <div class="col-lg-4 col-sm-4 hero-feature text-center">
            <div class="thumbnail">
                <a href="@Url.Action("Details", "Product", new { id = p.ProductID })" class="link-p" style="overflow: hidden; position: relative;">


                    **@if (p.Medium.Count > 0)
                    {
                        <img src="@p.Medium.ElementAt(0).MediaUrl" alt="" style="position: absolute; width: auto; height: 257px; max-width: none; max-height: none; left: 1px; top: 0px;">
                    }**
                </a>
                <div class="caption prod-caption">
                    <h4><a href="@Url.Action("Details", "Product", new { id = p.ProductID })">@p.ProductName.Substring(0, 1).ToUpper()@p.ProductName.Substring(1).ToLower()</a></h4>
                    <p>@p.ProductDescription</p>
                    <p>
                    </p>
                    <div class="btn-group">
                        <a href="#" class="btn btn-default">@p.Prices.OrderBy(pr => pr.PriceDate).FirstOrDefault().PriceValue</a>
                        @*                    <a href="#" class="btn btn-primary"><i class="fa fa-shopping-cart"></i>Buy</a>*@
                        @Html.ActionLink("Buy!", "Create", "Cart", new { id = p.ProductID, quantity = 1 }, new { @class = "btn btn-primary" })
                    </div>
                    <p></p>
                </div>
            </div>
        </div>
    }

the medium is a list of medium defined in the model of product each product has several media it looks like this

  public partial class Product
        {
            public Product()
            {

               ....
                this.Medium = new HashSet<Medium>();
            }

            public int ProductID { get; set; }
           ....
            public int MediaID { get; set; }
             .... 

            public virtual ICollection <Medium> Medium { get; set; }

        }

Upvotes: 0

Views: 53

Answers (1)

Efe
Efe

Reputation: 880

You don't need to define ProductMedia table since your relation seems to be 1-many.

Third table is defined in many-many relationships. each Product has multiple Media and each Media belongs to a single Product.

Your model does not need MediaId, which I think is the id for your default picture.

What you need to do is to pull media related to each product inside your controller.Something like this:

public ActionResult Index(string searchString)
{
   var products = dc.Products.ToList();

   foreach(p in products)
   {
       //I assume that your Medium table has a column named ProductID which is a foreign key to Product table
       p.Medium = dc.Medium.Where(x => x.ProductID == p.ProductID).ToList();
   }
    return View(products);
}

Inside your view, change the commented if statement to this in order to show the default Media of your product:

@if (p.Medium != Null && p.Medium.Any())
 {
      <img src="@p.Medium.First().MediaUrl" alt="" style="position: absolute; width: auto; height: 257px; max-width: none; max-height: none; left: 1px; top: 0px;">
 }

Upvotes: 1

Related Questions