Detailsview image swap

[daz69]

I have a detailsview with 3 bound thumbnail images.

I want to add a 4th image that will display a larger version of the thumbnail when someone clicks on it. (a 2 second job in Dreamweaver - I'm new to asp.net!)

I guess that I should be using imagebuttons and the onclientclick event instead but if my images are {P1} {P2} {P3} and {BigImage} what form should my javascript take?

Thanks -- Darren

 

[johnv20]

why not just do it on the server side with an onclick event..

something on the lines of the code below should work..

initially make the BigImage not visible

if (!IsPostBack)
  {
   BigImage.Visible = false; //could also be set via the properties of Bigimage
  }

then when the user clicks on P1 etc. set the image of BigImage to the P1 file & make visible..

BigImage.ImageUrl = "some location";
BigImage.Visible = true;

 

[daz69]

Thanks for the reply

If I use the ImageBig.ImageURL = "~/thumb/nopic.pg" I get 'ImageBig not declared' - how do I reference it correctly? (I thought document.xx but no go) - also to use a adatafield value for the URL can I just use ={P1} ?

I'm happy for ImageBig to initially show {P1} to I dont need to hide it.

 

[johnv20]

Not sure I understand you correctly so forgive me if you've already done this

The easy way to do this...
You need to add ImageBig to the page initially via the GUI same as you have for P1 etc..

Then either set the property of ImageBig to the P1 image or at page load use your code above i.e. ImageBig.ImageURL = "~/thumb/nopic.pg"

If you want to reference P1 image then just use the code below..

ImageBig.ImageUrl = P1.ImageUrl;

 

[daz69]

The issue is with the fact that the images are in a template field within the detailsview (i didnt tell you that - sorry)

I can reference/change URLS of images outside the templatefield but I'm unsure of how to reference them inside.