Foreach on ViewData in MVC 4 View

Question

The problem I have is I'm returning a single photo record from my database, which is working fine in my details view. However in the controller under details I'm also compiling a list object, which I want to display in my details view as this contains additional photos that are associated. So at the bottom of the view it should list each referenced photo name. I'm using the Galleria.Io photo viewer and I want to plug this into it.

When I try and loop through each item in the list I'm getting:

{"Object reference not set to an instance of an object."}

Code

PhotosController

public ActionResult Details(int id = 0)
{
    Photos photos = db.FindPhotoById(id);
    if (photos == null)
    {
        return HttpNotFound();
    }

    List<Photos> photoList = GetImagesFromFilmID(8);

    ViewData["NumberOfImages"] = photoList.Count().ToString();
    ViewData["PhotoList"] = photoList;

    return View(photos);
}

public List<Photos> GetImagesFromFilmID(int filmID = 8 )
{

    List<Photos> photos;

    photos = (from p in db.Photos
              where p.PhotoDescription == "8"
              select p).Take(filmID).ToList();

    return photos;
}

Details View

@model TestingMVCQA.Models.Photos
@*@model IEnumerable<TestingMVCQA.Models.Photos>*@
@{
    ViewBag.Title = "Details";
}

<h2>Details</h2>

<fieldset>
<legend>Photos</legend>

<div class="display-label">
    @Html.DisplayNameFor(model => model.PhotoName)
</div>
<div class="display-field">
    @Html.DisplayFor(model => model.PhotoName)
</div>

<div class="display-label">
    @Html.DisplayNameFor(model => model.PhotoDescription)
</div>
<div class="display-field">
    @Html.DisplayFor(model => model.PhotoDescription)
</div>

<div class="display-label">
    @Html.DisplayNameFor(model => model.PhotoFileName)
</div>
<div class="display-field">
    @Html.DisplayFor(model => model.PhotoFileName)
</div>

<div class="display-label">
    @Html.DisplayNameFor(model => model.ImageMimeType)
</div>
<div class="display-field">
    @Html.DisplayFor(model => model.ImageMimeType)
</div>

<script src="@Url.Content("~/Scripts/jquery-1.7.1.js")"></script>
<script src="@Url.Content("~/Scripts/galleria-1.3.6.js")"></script>

<style>
   .galleria{ width: 900px; height: 500px; background: #000 }
</style>

@if (Model.PhotoFile != null) {
  <div class="galleria">
     <img src="@Url.Action("GetImage", "Photos", new { id = Model.PhotoID })" data-title="My title" data-description="My description" />
<img src="@Url.Action("GetImage", "Photos", new { id = 5 })" />
<img src="@Url.Action("GetImage", "Photos", new { id = 6 })" />
<img src="@Url.Action("GetImage", "Photos", new { id = 7 })" />
<img src="@Url.Action("GetImage", "Photos", new { id = 8 })" />
<img src="@Url.Action("GetImage", "Photos", new { id = 9 })" />
<img src="@Url.Action("GetImage", "Photos", new { id = 10 })" />
<img src="@Url.Action("GetImage", "Photos", new { id = 11 })" />
<img src="@Url.Action("GetImage", "Photos", new { id = 12 })" />
<img src="@Url.Action("GetImage", "Photos", new { id = 13 })" />
<img src="@Url.Action("GetImage", "Photos", new { id = 14 })" />
</div>
}

<script>
    Galleria.loadTheme(src = "@Url.Content("~/Scripts/galleria.classic.js")");
    Galleria.run('.galleria');
</script>

</fieldset>

<p>Your favorite fruit is:</p>@ViewData["NumberOfImages"]
<p>
   @foreach (var item in ViewData["NumberOfImages"] as IEnumerable<TestingMVCQA.Models.Photos>)
{
}
</p>

<p>
@Html.ActionLink("Edit", "Edit", new { id=Model.PhotoID }) |
@Html.ActionLink("Back to List", "Index")
</p>

In the index view I have:

@model IEnumerable<TestingMVCQA.Models.Photos>

Which allows me to use the foreach and I understand why but as I'm returning a single object in the details view I'm a bit stuck on how to resolve the issue. So when it is all working I can then replace the GetImage call and foreach on the image itself.

If you require any additional code or explanation then let me know.

Answer 1

You are using ViewData["NumberOfImages"] in foreach loop which is wrong.

Your foreach loop should look like this :-

@foreach (var item in ViewData["PhotoList"] as IEnumerable<TestingMVCQA.Models.Photos>)
{
  //@item.FileName //instead .FileName use property which you have used in your model class
}