MVC
MVC

Reputation: 679

How to implement image dynamically in multiple views?

I am looking for a way to display the Image dynamically based on Placement_Position and Region into different View.

Placement view, where I display all the content from table.

There is no link between these Views.

I am confused, how to implement this scenario. Anyone please help me here.

In Employee view, I want to display the image Atop_1if the region is 1 and Atop_2 if the region is 2

Table

   public class ClsPlacement
    {
        public int Id { get; set; }
        public string Placement_Position { get; set; }
        public string Path { get; set; }
        public int Region { get; set; }

    }

Controller

       public ActionResult Placement()
        {
            var model = context.Placement.ToList();
            return View(model);
        }

Placement View

<table>
    <tr>
        <th>
            @Html.DisplayNameFor(m => m.Id)
        </th>

        <th>
            @Html.DisplayNameFor(m => m.Placement_Position)
        </th>

        <th>
            @Html.DisplayNameFor(m => m.Region)
        </th>
        <th>
            @Html.DisplayNameFor(m => m.Path)
        </th>


    </tr>

    @foreach (var item in Model)
    {
        <tr>

            @Html.DisplayFor(modelItem => item.Id)

            <td>
                @Html.DisplayFor(modelItem => item.Placement_Position)
            </td>

            <td>
                @Html.DisplayFor(modelItem => item.Region)
            </td>
            <td>
               @Html.Image(item.Path, "Image")
            </td>

        </tr>
                    }
</table>

Upvotes: 1

Views: 150

Answers (1)

Mohammad
Mohammad

Reputation: 1577

you can use LINQ to write query for each controller and return IList :

so in Employee view :

    public ActionResult Employee()
    {
     IList<ClsPlacement> plcList = new List<ClsPlacement>();
     var query= from m in context.Placement
                select m;
     var plc= query.ToList();
        foreach(var plcData in plc)
        {
         if(plcData.Placement_Position=="A_Top")
          {
           plcList.Add(new ClsPlacement()
            {
                Id= plcData.Id,
                Placement_Position= plcData.Placement_Position,
                Path = plcData.Path ,
                Region= plcData.Region
            });
          }
        }
        return View(plcList);      
    } 

then in your view you can write this:

 @foreach (var item in Model)
{
     <div class="col-md-5">  
     <img src="@Url.Content(String.Format("~/Content/Place/{0}{1}{2}", "Atop_",item.Region,".jpg"))" />
</div>
}

and same this for Customer view.

Upvotes: 1

Related Questions