Hi,
If i understand correctly, you have a number of small images on a form, and as the user clicks on them you have a larger place on the form reserved for showing any of the images at higher res?
I can see a few ways of doing this, personally i'd use Javascript on the client side, but you could also try using standard nettalk.
The concept with javascript is basically this:
Add into the form some custom XHTML in the right place where you want your larger image to show i'd start with "Before </form>"
<img id="PreviewImage" src="images/blank.png" width=400px height=300px />
The id here is key, id is like class except with id there can be only one on a page, which will allow us to find this img later in Javascript.
Id also write a javascript function and stick into the page (once its all working nicely you could place it in your custom script files for use anywhere), meanwhile place it inside XHTML section say "Before <form>" will do..
<script type="text/javascript">
function replaceImage(myID, newURL) {
var imgTag = document.getElementById(myID)
imgTag.src = newURL
}
</script>
You've now done all the preparation work. All that is left is to call the Javascript function (on the client side) with those two arguments.
replaceImage('PreviewImage','images/image1.png');
You can wrap your thumbnail image in an anchor tag or use the onclick javascript extension:
<a href="javascript: replaceImage('PreviewImage','images/image1.png');" ...thumbnail image in here... </a>
or
<img src="images/thumbnail1.png" onclick="replaceImage('PreviewImage','images/image1.png');" />
The other method would be to try and use NetTalks built-in ajax to refresh a display control with a new value. It should work also.
Regards
Bill
Topic: displaying images in aform (Read 4220 times)