Show image preview from form list

Nebooaw · Mar 4, 2005

Hi i have a dynamic list of parts in a form, each part has a drawing name attached. When i select a part i want a little preview of the image to be displayed on the screen instantly in a layer or somthing. When the form is submitted i wan the part name to be passed to the next page not the drawing name.

Hope this makes scence, can any one help?

Kindest regards.

BillyRayPreachersSon · Mar 4, 2005

There are several ways you could do this, that I can see. This is just as easy as the others.

My interpretation of your statement "i wan the part name to be passed to the next page not the drawing name." is that you do not want the image filename passed through, but you do want the text displayed in the select box to be passed through (rather than the value). If this is not what you want, could you clarify your statement?

Anyway - what I am interpreting as "the part name" will be passed through in the hidden field:

Code:

<html>
<head>
	<script type="text/javascript">
	<!--
		function setField(selBox) {
			var whichOpt = selBox.options[selBox.selectedIndex];
			document.getElementById('myImage').src = whichOpt.value;
			document.forms['myForm'].elements['mySelectPartName'].value = whichOpt.text;
		}
	//-->
	</script>
</head>
<body onload="setField(document.forms['myForm'].elements['mySelect']);">
	<form name="myForm">
		<select name="mySelect" onchange="setField(this);">
			<option value="part1Image.gif">Part 1</option>
			<option value="part2Image.gif">Part 2</option>
		</select>
		<input type="hidden" name="mySelectPartName" />
	</form>
	<br />
	<img id="myImage" src="" />
</body>
</html>

Hope this helps,
Dan

The answers you get are only as good as the information you give!

Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

Show image preview from form list

Nebooaw

Programmer

BillyRayPreachersSon

Programmer

Similar threads

Part and Inventory Search

Sponsor