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!

  • Congratulations strongm on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

Replace Images

Status
Not open for further replies.

Killborg

Technical User
Jul 16, 2007
46
US
Hello
I have a form that does a calculation. But what I need to do is replace an images based upon the number the user enters. If the users enters a number 6 in "txt01" field.
Image "Bl01" which is a place holder will display the image the image file "06.jpg". If 2 is entered into "txt01" image "02.jpg" is displayed. There are a total of six place holder images that will display new images. The fields that will drive the image changes are txt01 txt02 txt03 txt04 txt05 txtFourthNumber I need a javascript that will do this and have not figured out how to do this.
Can anyone help.

This is what I have already.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "<html xmlns="<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />

<title>Barcode Calculator - Zip Code</title>


<script language="JavaScript1.2" type="text/javascript">
top.window.moveTo(0,0);
if (document.all) {
top.window.resizeTo(screen.availWidth,screen.availHeight);
}
else if (document.layers||document.getElementById) {
if (top.window.outerHeight<screen.availHeight||top.window.outerWidth<screen.availWidth){
top.window.outerHeight = screen.availHeight;
top.window.outerWidth = screen.availWidth;
}
}
//-->
</script>
<script language = "JavaScript" type="text/javascript">
function autotab(original,destination){
if (original.getAttribute&&original.value.length==original.getAttribute("maxlength"))
destination.focus()
}

function calculate() {
A = eval(document.ZipCodeCalc1.txt01.value)
B = eval(document.ZipCodeCalc1.txt02.value)
C = eval(document.ZipCodeCalc1.txt03.value)
D = eval(document.ZipCodeCalc1.txt04.value)
E = eval(document.ZipCodeCalc1.txt05.value)
F = (A + B + C + D + E)
A11 = document.ZipCodeCalc1.txt01E.value
A1 = document.ZipCodeCalc1.txt01.value
B1 = document.ZipCodeCalc1.txt02.value
C1 = document.ZipCodeCalc1.txt03.value
D1 = document.ZipCodeCalc1.txt04.value
E1 = document.ZipCodeCalc1.txt05.value
F1 = document.ZipCodeCalc1.txtFourthNumber.value
F11 = document.ZipCodeCalc1.txt02E.value
G1 = (A11 + A1 + B1 + C1 + D1 + E1 + F1 + F11)
document.ZipCodeCalc1.txtCom.value = G1
document.ZipCodeCalc1.txtThirdNumber.value = F
if (document.ZipCodeCalc1.txtThirdNumber.value == 1)
document.ZipCodeCalc1.txtFourthNumber.value = "9";
else if (document.ZipCodeCalc1.txtThirdNumber.value == 2)
document.ZipCodeCalc1.txtFourthNumber.value = "8";
else if (document.ZipCodeCalc1.txtThirdNumber.value == 3)
document.ZipCodeCalc1.txtFourthNumber.value = "7";
else if (document.ZipCodeCalc1.txtThirdNumber.value == 4)
document.ZipCodeCalc1.txtFourthNumber.value = "6";
else if (document.ZipCodeCalc1.txtThirdNumber.value == 5)
document.ZipCodeCalc1.txtFourthNumber.value = "5";
else if (document.ZipCodeCalc1.txtThirdNumber.value == 6)
document.ZipCodeCalc1.txtFourthNumber.value = "4";
else if (document.ZipCodeCalc1.txtThirdNumber.value == 7)
document.ZipCodeCalc1.txtFourthNumber.value = "3";
else if (document.ZipCodeCalc1.txtThirdNumber.value == 8)
document.ZipCodeCalc1.txtFourthNumber.value = "2";
else if (document.ZipCodeCalc1.txtThirdNumber.value == 9)
document.ZipCodeCalc1.txtFourthNumber.value = "1";
else if (document.ZipCodeCalc1.txtThirdNumber.value == 10)
document.ZipCodeCalc1.txtFourthNumber.value = "0";
if (document.ZipCodeCalc1.txtThirdNumber.value == 11)
document.ZipCodeCalc1.txtFourthNumber.value = "9";
else if (document.ZipCodeCalc1.txtThirdNumber.value == 12)
document.ZipCodeCalc1.txtFourthNumber.value = "8";
else if (document.ZipCodeCalc1.txtThirdNumber.value == 13)
document.ZipCodeCalc1.txtFourthNumber.value = "7";
else if (document.ZipCodeCalc1.txtThirdNumber.value == 14)
document.ZipCodeCalc1.txtFourthNumber.value = "6";
else if (document.ZipCodeCalc1.txtThirdNumber.value == 15)
document.ZipCodeCalc1.txtFourthNumber.value = "5";
else if (document.ZipCodeCalc1.txtThirdNumber.value == 16)
document.ZipCodeCalc1.txtFourthNumber.value = "4";
else if (document.ZipCodeCalc1.txtThirdNumber.value == 17)
document.ZipCodeCalc1.txtFourthNumber.value = "3";
else if (document.ZipCodeCalc1.txtThirdNumber.value == 18)
document.ZipCodeCalc1.txtFourthNumber.value = "2";
else if (document.ZipCodeCalc1.txtThirdNumber.value == 19)
document.ZipCodeCalc1.txtFourthNumber.value = "1";
else if (document.ZipCodeCalc1.txtThirdNumber.value == 20)
document.ZipCodeCalc1.txtFourthNumber.value = "0";
if (document.ZipCodeCalc1.txtThirdNumber.value == 21)
document.ZipCodeCalc1.txtFourthNumber.value = "9";
else if (document.ZipCodeCalc1.txtThirdNumber.value == 22)
document.ZipCodeCalc1.txtFourthNumber.value = "8";
else if (document.ZipCodeCalc1.txtThirdNumber.value == 23)
document.ZipCodeCalc1.txtFourthNumber.value = "7";
else if (document.ZipCodeCalc1.txtThirdNumber.value == 24)
document.ZipCodeCalc1.txtFourthNumber.value = "6";
else if (document.ZipCodeCalc1.txtThirdNumber.value == 25)
document.ZipCodeCalc1.txtFourthNumber.value = "5";
else if (document.ZipCodeCalc1.txtThirdNumber.value == 26)
document.ZipCodeCalc1.txtFourthNumber.value = "4";
else if (document.ZipCodeCalc1.txtThirdNumber.value == 27)
document.ZipCodeCalc1.txtFourthNumber.value = "3";
else if (document.ZipCodeCalc1.txtThirdNumber.value == 28)
document.ZipCodeCalc1.txtFourthNumber.value = "2";
else if (document.ZipCodeCalc1.txtThirdNumber.value == 29)
document.ZipCodeCalc1.txtFourthNumber.value = "1";
else if (document.ZipCodeCalc1.txtThirdNumber.value == 30)
document.ZipCodeCalc1.txtFourthNumber.value = "0";
if (document.ZipCodeCalc1.txtThirdNumber.value == 31)
document.ZipCodeCalc1.txtFourthNumber.value = "9";
else if (document.ZipCodeCalc1.txtThirdNumber.value == 32)
document.ZipCodeCalc1.txtFourthNumber.value = "8";
else if (document.ZipCodeCalc1.txtThirdNumber.value == 33)
document.ZipCodeCalc1.txtFourthNumber.value = "7";
else if (document.ZipCodeCalc1.txtThirdNumber.value == 34)
document.ZipCodeCalc1.txtFourthNumber.value = "6";
else if (document.ZipCodeCalc1.txtThirdNumber.value == 35)
document.ZipCodeCalc1.txtFourthNumber.value = "5";
else if (document.ZipCodeCalc1.txtThirdNumber.value == 36)
document.ZipCodeCalc1.txtFourthNumber.value = "4";
else if (document.ZipCodeCalc1.txtThirdNumber.value == 37)
document.ZipCodeCalc1.txtFourthNumber.value = "3";
else if (document.ZipCodeCalc1.txtThirdNumber.value == 38)
document.ZipCodeCalc1.txtFourthNumber.value = "2";
else if (document.ZipCodeCalc1.txtThirdNumber.value == 39)
document.ZipCodeCalc1.txtFourthNumber.value = "1";
else if (document.ZipCodeCalc1.txtThirdNumber.value == 40)
document.ZipCodeCalc1.txtFourthNumber.value = "0";
if (document.ZipCodeCalc1.txtThirdNumber.value == 41)
document.ZipCodeCalc1.txtFourthNumber.value = "9";
else if (document.ZipCodeCalc1.txtThirdNumber.value == 42)
document.ZipCodeCalc1.txtFourthNumber.value = "8";
else if (document.ZipCodeCalc1.txtThirdNumber.value == 43)
document.ZipCodeCalc1.txtFourthNumber.value = "7";
else if (document.ZipCodeCalc1.txtThirdNumber.value == 44)
document.ZipCodeCalc1.txtFourthNumber.value = "6";
else if (document.ZipCodeCalc1.txtThirdNumber.value == 45)
document.ZipCodeCalc1.txtFourthNumber.value = "5";
}
</script>
<link href="../CompStyles/mm_Tools_Styles.css" rel="stylesheet" type="text/css" />

<link href="../CompStyles/Comp_Corner.css" rel="stylesheet" type="text/css" />
<style type="text/css">
<!--
.style1 {font-size: 12px}
-->
</style>
</head>
<body>
<br />

<table width="613" border="0" align="left" cellpadding="0" cellspacing="0">
<tr>
<td height="235" colspan="2" valign="top"><form action="" method="post" name="ZipCodeCalc1" id="ZipCodeCalc1">
<p class="pageTitle">&nbsp;</p>
<table width="576" border="1" align="center" cellpadding="1" cellspacing="1" bgcolor="#000000">
<tr>
<td height="20" colspan="5" bgcolor="cccccc"><div align="center" class="BarHeader">Enter ZipCode in the Red Field </div></td>
</tr>
<tr>
<td width="45"><div align="center">
<input name = "txt01E" type="hidden" id="txt01E" value ="E" size = "2" maxlength="1" />
</div></td>
<td width="308" bgcolor="9a1b1f"><div align="center">
<input type="Text value =" name="txt01" size="2" onkeyup="autotab(this, document.ZipCodeCalc1.txt02)" maxlength="1" />
<input type="Text value =" name="txt02" size="2" onkeyup="autotab(this, document.ZipCodeCalc1.txt03)" maxlength="1" />
<input type="Text value =" name="txt03" size="2" onkeyup="autotab(this, document.ZipCodeCalc1.txt04)" maxlength="1" />
<input type="Text value =" name="txt04" size="2" onkeyup="autotab(this, document.ZipCodeCalc1.txt05)" maxlength="1" />
<input type="Text value =" name="txt05" size="2" onkeyup="autotab(this, document.ZipCodeCalc1.txt05)" maxlength="1" />
</div></td>
<td width="45"><div align="center">
<input name = "txt02E" type="hidden" id="txt02E" value ="E" size = "2" maxlength="1" />
</div></td>
<td width="75"><div align="center">
<input type = "text" name = "txtThirdNumber" size = "7" value = "" />
</div></td>
<td width="75"><div align="center">
<input name = "txtFourthNumber" type = "text" id="txtFourthNumber" size = "7" />
</div></td>
</tr>
<tr>
<td height="35"><div align="center" class="style1"><span class="BarCenterTextWhite">Frame<br />
Bar</span> </div></td>
<td height="35" bgcolor="9a1b1f"><div align="center" class="BarCenterTextWhite">ZIPCODE</div></td>
<td height="35"><div align="center" class="BarCenterTextWhite">Frame<br />
Bar </div></td>
<td height="35"><div align="center" class="BarCenterTextWhite">Total</div></td>
<td height="35"><div align="center" class="BarCenterTextWhite">Correction<br />
Number </div></td>
</tr>
<tr>
<td colspan="5"><div align="center" class="style1"></div>
<div align="center" class="style1"></div>
<div align="center" class="style1">
<input type = "button" name = "b1" value = "Calculate Barcode" onclick = "calculate()" />
<input type = "button" name = "b1" value = "Add Correction Number" onclick = "calculate()" />
<input type="reset" value="Reset Form" />
</div></td>
</tr>
<tr>
<td height="75" colspan="5" bgcolor="cccccc"><p align="center" class="style1"><strong>Before coping the Barcode information select &quot;Add Correction Number&quot; </strong></p>
<p align="center" class="style1"><strong><br />
The Barcode information
is listed below. Highlight the information.</strong></p>
<p align="center" class="style1"><strong><br />
Copy and Paste information on the master. </strong> </p>
<div align="center">
<div align="center">
<input name = "txtCom" type = "text" id="txtCom" size = "20" />
</div>
<div align="center"> </div>
</div></td>
</tr>
</table>
<table width="600" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td width="100" height="50"><img src="Bl01.jpg" name="Bl01" width="100" height="50" id="Bl01" /></td>
<td width="100" height="50"><img src="Bl02.jpg" name="Bl02" width="100" height="50" id="Bl02" /></td>
<td width="100" height="50"><img src="Bl03.jpg" name="Bl03" width="100" height="50" id="Bl03" /></td>
<td width="100" height="50"><img src="Bl04.jpg" name="Bl04" width="100" height="50" id="Bl04" /></td>
<td width="100" height="50"><img src="Bl05.jpg" name="Bl05" width="100" height="50" id="Bl05" /></td>
<td width="100" height="50"><img src="Bl06.jpg" name="Bl06" width="100" height="50" id="Bl06" /></td>
</tr>
</table>
<p>&nbsp;</p>
</form></td>
</tr>
<tr>
<td width="140" height="1" valign="top"><img width="140" height="1" src="file:///D|/SAFERESOURCES/transparent.gif" /></td>
<td width="624" height="1" valign="top"><img width="463" height="1" src="file:///D|/SAFERESOURCES/transparent.gif" /></td>
</tr>
</table>
</body>
</html>


Thanks for the help
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top