PDA

View Full Version : Dropdown menu which populates field


sarah
01-09-2003, 02:32 PM
Hi,

I am using dropdown menus on my page and I wanted to know if its possible to populate a field with some pre-defined value depending on the value of the dropdown menu. I.e:

Menu 1 - Product
Menu 2 - Range
Field - Price

If the user chooses a vase in the fosters range, the price shown will be 10, if the range is amber price is 15 and so on...

Is this possible?

jalarie
01-09-2003, 03:40 PM
How about a little more detail as to what your drop-downs contain, or a link to your page as it currently exists?

arnyinc
01-09-2003, 04:07 PM
Here is a very static example that should you give some ideas.

<html>
<head>
<script language="javascript">
function show_price(){
if (document.myform.product.options[0].selected){
if (document.myform.range.options[0].selected)
document.myform.price.value='10';
else if (document.myform.range.options[1].selected)
document.myform.price.value='20';
else if (document.myform.range.options[2].selected)
document.myform.price.value='30';
}
else if (document.myform.product.options[1].selected){
if (document.myform.range.options[0].selected)
document.myform.price.value='40';
else if (document.myform.range.options[1].selected)
document.myform.price.value='50';
else if (document.myform.range.options[2].selected)
document.myform.price.value='60';
}
else if (document.myform.product.options[2].selected){
if (document.myform.range.options[0].selected)
document.myform.price.value='70';
else if (document.myform.range.options[1].selected)
document.myform.price.value='80';
else if (document.myform.range.options[2].selected)
document.myform.price.value='90';
}
}
</script>
</head>
<body>
<form name="myform">
<select name="product">
<option>vase</option>
<option>cup</option>
<option>plate</option>
</select>
<br>
<select name="range">
<option>amber</option>
<option>foster</option>
<option>something</option>
</select>
<br>
<input type="button" onclick="show_price()" value="calculate price">
<br>
<br>
<input type="text" name="price">
</form>
</body>
</html>