I have several drop down menus for selecting t-shirts by size on one page. The first drop down menu works great, but the subsequent drop down menus return a blank instead of passing through the option values. I have read other posts that suggest to give each drop down menu a different form name, but the subsequent drop down menus still don't work. Here is my code for the first one that works and the second which doesn't. Help would be greatly appreciated.
HEAD SECTION:
function movevalue()
{
s=document.getElementById("select_size");
document.getElementById("itemname").value=s.options[s.options.selectedIndex].value;
}
function movevalue2()
{
s=document.getElementById("select_size2");
document.getElementById("itemname").value=s.options[s.options.selectedIndex].value;
}
---------------------------------------------------------------------------------------------
BODY SECTION:
1st drop down menu – works fine.
<form name="form1" method=post action="/cgi-bin/eshop.cgi?command=add">
<form method=post action="/cgi-bin/eshop.cgi?command=showsearch">
<form method=post action="/cgi-bin/eshop.cgi?command=review">
<form method=post action="/cgi-bin/eshop.cgi?command=buy1">
<FORM METHOD=POST ACTION="
https://secure4.mysecureorder.net/xyz/cgi-bin/eshop.cgi?command=buy1">
<font size="2" font color="000000">Qty. </font>
<input type=text size=3 name="itemquant" value=1>
<select name="select_size" id="select_size" onchange="movevalue();">
<option>Select Size</option>
<option value="Red T-shirt, Small">Small</option>
<option value="Red T-shirt, Med">Medium</option>
<option value="Red T-shirt, LG">Large</option>
<option value="Red T-shirt, XL">XL</option></select>
<input type=hidden name="itemname" id="select_size" value=" "> {This line works and option values pass through correctly}
<input type=submit value="Add to Cart"></font>
2nd drop down menu with different form name doesn’t work – returns a blank in the “itemname” field.
<form name="form2" method=post action="/cgi-bin/eshop.cgi?command=add">
<form method=post action="/cgi-bin/eshop.cgi?command=showsearch">
<form method=post action="/cgi-bin/eshop.cgi?command=review">
<form method=post action="/cgi-bin/eshop.cgi?command=buy1">
<FORM METHOD=POST ACTION="
https://secure4.mysecureorder.net/xyz/cgi-bin/eshop.cgi?command=buy1">
<font size="2" font color="000000">Qty. </font>
<input type=text size=3 name="itemquant" value=1>
<select name="select_size2" id="select_size2" onchange="location=document.form2.select_size2.options[document.form2.select_size2.selectedIndex].movevalue2();">
<option>Select Size</option>
<option value="Blue T-shirt, Small”>Small</option>
<option value="Blue T-shirt, Med">Medium</option>
<option value="Blue T-shirt, LG">Large</option>
<option value="Blue T-shirt, XL">XL</option></select>
<input type=hidden name="itemname" id="select_size2" value=" "> { this line returns a blank instead of info.}
<input type=submit value="Add to Cart"><P></B>
