Question

I have my Controller which pass Data from to view as below:

IEnumerable<MovieDetails> jsonData = default(IEnumerable<MovieDetails>);

#region Constructor Request to get all Data
public MoviesController()
{
    jsonData = GetJsonValues(URL);
}
public ActionResult Index()
{
    return View(jsonData);
}

Now my view is rendering the controls as :

@model IEnumerable<VikiMVC.Models.MovieDetails>

@foreach (var movieDetails in Model)
{
    <!--Deleted Divs for Simplicity -->
    <img src = @movieDetails.Thumbnail alt = @movieDetails.Thumbnail 
          class="imgStyle"onclick="playMovie(this)" alt=@movieDetails.MovieURI/>     
}

Now on click of Image I want to open up another view and access the @movieDetails related to that particular item.

My Movie Details class goes like :

public class MovieDetails
{
   public string Title { get; set; }
   public string Thumbnail { get; set; }
   // public string URI { get; set; }
   public string Description { get; set; }
   public string MovieURI { get; set; }
   // public List<Response> Response { get; set; }
}

SO when I click on an Image I should be able access the MovieURI specific to that particular image. We can do that using querystring , but Razor must be having some thing better.

Answer 1

Why do you have alt on image twice? Try this:

@foreach (var movieDetails in Model)
{
    <!--Deleted Divs for Simplicity -->
    <img src = @movieDetails.Thumbnail class="imgStyle" onclick="playMovie('@movieDetails.MovieURI')" alt=@movieDetails.MovieURI/>     
}

In js:

function playMovie(uri){
    window.location.href = uri;
}

But I would suggest something like this (add Id field in model):

@foreach (var movieDetails in Model)
{
    <!--Deleted Divs for Simplicity -->
    <a href="/Mycontroller/Movie/@movieDetails.Id">
        <img src = @movieDetails.Thumbnail class="imgStyle" alt=@movieDetails.MovieURI/>   
    </a>  
}

Action:

public ActionResult Movie(int id)
{
    var movieModel = context.Movies.GetById(id);
    return View(movieModel);
}