Open clicked image inside image control (asp.net/c#)

Question

Inside my application I'm generating some images inside hyperlink controls that opens up the image in full size. I have a image control at the top of the page where I want the clicked image to be displayed, but with the code I have that doesn't work.

What happens is that the clicked image is opened on a new page, so what I wonder is how to make the image appear in the image control?

<asp:Image ID="fullSizeImage" runat="server" />

<asp:HyperLink ID="link" runat="server" NavigateUrl='<%# Eval("Name", "...directory...") %>' >
    <asp:Image ID="Image" runat="server" ImageUrl='<%# Eval("Name", "...directory...") %>' CssClass="thumb" />
</asp:HyperLink>

Thanks in advance.

Alex Mendez · Accepted Answer · 2012-02-21 18:07:20Z

1

You can do something like this:

<script runat="server">
    protected void thumbImage_Click(object sender, ImageClickEventArgs e)
    {
        fullSizeImage.ImageUrl = "full size image path goes here";
    }
</script>

<asp:Image ID="fullSizeImage" runat="server" />
<asp:ImageButton ID="thumbImage" runat="server" ImageUrl="image path goes here" onclick="thumbImage_Click" />

edited Feb 21, 2012 at 18:07

answered Feb 21, 2012 at 17:50

Alex Mendez

5,1501 gold badge27 silver badges23 bronze badges

Sign up to request clarification or add additional context in comments.

5 Comments

holyredbeard Over a year ago

Thanks for answering. Regarding the click event, how can I "extract" the ImageUrl from the clicked image and pass it to the event?

Alex Mendez Over a year ago

If you want to use the same image as the one used in your thumbnail, then you can do the following: fullSizeImage.ImageUrl = thumbImage.ImageUrl; on the thumbImage_Click handler. However, for performance reasons, you should have a real thumbnail image and the full size image instead of shrinking the full image and using it for the thumbnail.

holyredbeard Over a year ago

It didn't appear in my question, but the imageUrl for the thumbnail goes to a directory for thumbnails (ie. "real" thumbnails). The only difference in the directories between the full size images and the thumbnails is "/thumbnails/". Do I need to split up the address to be able to remove "/thumbnails/", or do you know if there's an easier way? Thanks again.

Alex Mendez Over a year ago

The url is a string, you can just use .Replace("thumbnails", "real");

holyredbeard Over a year ago

Ok, great. One last thing. By some strange reason I can't access the ID of the ImageButton inside the event "doesn't exist in the context...". I have the ImageButton inside an ItemTemplate, could that be the reason?

Luke · Accepted Answer · 2017-03-24 04:23:27Z

0

put an img tag in an anchor tag and give

src='<%#Eval("put image address from table column")%>'

and put that same value in the link

href='<%#Eval("put image address from table column")%>'

edited Mar 24, 2017 at 4:23

Luke

2,5721 gold badge18 silver badges35 bronze badges

answered Mar 24, 2017 at 3:57

naresh

1

Collectives™ on Stack Overflow

Open clicked image inside image control (asp.net/c#)

2 Answers 2

5 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

5 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related