Foamy
06-13-2003, 01:53 PM
With the gracious help of other on this board, I was was able to swap images based on what was selected in a pull-down menu.
Now I would like to use the same function to replace the value of a hidden field with value of the selected option.
Here's the relevant JS
function previewPicJN(sel) {
document.previewpicJN.src = mylabelJN[sel.selectedIndex];
document.op1.value = myvalueJN[sel.selectedIndex];
}
mylabelJN = new Array("/images/jn/BEEF-RICE--W_O--CUT-100.jpg", "/images/jn/LAMB-RICE-W_O-CUT-100.jpg", "/images/jn/beef-lamb.jpg");
myvalueJN = new Array("Beef", "Lamb", "Mixed (Beef,Lamb)");
And here's the form:
<form method="post" action="http://www.cartserver.com/sc/cart.cgi">
<input type="hidden" name="op1" value="Beef">
<td align="center" rowspan="2"><select name=flavorsJN size=1 onChange="previewPicJN(this)">
<option myvalueJN="Beef" mylabelJN="/images/jn/BEEF-RICE--W_O--CUT-100.jpg" selected >Beef & Rice
<option myvalueJN="Lamb" mylabelJN="/images/jn/LAMB-RICE-W_O-CUT-100.jpg">Lamb & Rice
<option myvalueJN="Mixed (Beef, Lamb)" mylabelJN="/images/jn/beef-lamb.jpg">1/2 Beef, 1/2 Lamb
</select></td>
<td align="center"><input type="image" border="0" name="add" src="/images/common/order.gif"></td>
<td align="center" rowspan="2"><img name="previewpicJN" src="/images/jn/BEEF-RICE--W_O--CUT-100.jpg" width=100 height=125 border=0></td>
<td></td>
</form>
The images swap just fine, but the value of op1 does not; it remains as Beef. I know I can rename the pulldown op1 and pass the value that way, but there are other forms on the page that also have the hidden op1 input, but don't have the pull-down.
Thanks for any suggestions or pointers you might have for a total JS newbie.
Here's a link to the page in question
http://171.65.19.77/jerkynaturals/index.html
Now I would like to use the same function to replace the value of a hidden field with value of the selected option.
Here's the relevant JS
function previewPicJN(sel) {
document.previewpicJN.src = mylabelJN[sel.selectedIndex];
document.op1.value = myvalueJN[sel.selectedIndex];
}
mylabelJN = new Array("/images/jn/BEEF-RICE--W_O--CUT-100.jpg", "/images/jn/LAMB-RICE-W_O-CUT-100.jpg", "/images/jn/beef-lamb.jpg");
myvalueJN = new Array("Beef", "Lamb", "Mixed (Beef,Lamb)");
And here's the form:
<form method="post" action="http://www.cartserver.com/sc/cart.cgi">
<input type="hidden" name="op1" value="Beef">
<td align="center" rowspan="2"><select name=flavorsJN size=1 onChange="previewPicJN(this)">
<option myvalueJN="Beef" mylabelJN="/images/jn/BEEF-RICE--W_O--CUT-100.jpg" selected >Beef & Rice
<option myvalueJN="Lamb" mylabelJN="/images/jn/LAMB-RICE-W_O-CUT-100.jpg">Lamb & Rice
<option myvalueJN="Mixed (Beef, Lamb)" mylabelJN="/images/jn/beef-lamb.jpg">1/2 Beef, 1/2 Lamb
</select></td>
<td align="center"><input type="image" border="0" name="add" src="/images/common/order.gif"></td>
<td align="center" rowspan="2"><img name="previewpicJN" src="/images/jn/BEEF-RICE--W_O--CUT-100.jpg" width=100 height=125 border=0></td>
<td></td>
</form>
The images swap just fine, but the value of op1 does not; it remains as Beef. I know I can rename the pulldown op1 and pass the value that way, but there are other forms on the page that also have the hidden op1 input, but don't have the pull-down.
Thanks for any suggestions or pointers you might have for a total JS newbie.
Here's a link to the page in question
http://171.65.19.77/jerkynaturals/index.html