MVC Image Handling using WebImage and JavaScript

Question

In a view, I have the following fieldset which displays images, in thumbnail type form, associated with a particular item:

<fieldset style="position:absolute; top:113px; left: 1050px; width: 300px;">
    <legend>Photos</legend>

    <div>
        <img src="@Url.Action("GetImage1")" alt="" />
        <img src="@Url.Action("GetImage2")" alt="" />     
        <img src="@Url.Action("GetImage2")" alt="" />     
    </div>

</fieldset>

In my controller, I have the following code:

public void GetImage1()
{
    BicycleSellerListing bicyclesellerlisting = db.BicycleSellerListing.Find(1023);

    WebImage wbImage = new WebImage(bicyclesellerlisting.ImageList.First().Image);
    wbImage.Resize(100, 100);
    wbImage.FileName = "Item.jpg";
    wbImage.Write();
}

All of this works fine. I am fairly new to MVC, HTML and JavaScript, and don't know how to do the following. What I would like to do is to allow the user to click on an image and have another View load where I display the full size of the image in that view.

Answer 1

It depends what you want to get from this. Do you want it to display the image alone on a new page or show the full image on the same page using AJAX?

If it's the latter, you might want to look into using partial views.