Need to auto fill text field based on drop down

I need javascript to do the follow bellow is the code I use

I need it so if someone selects  11 from the second drop down the amount feild would put a value 1 in place
for example
11 = 1
12 = 3
13 = 6
21 = 10
22 = 13
23 =30

I been looking everywhere and found nothing

I am very new at coding and need this
Please help
<html>
<head>
<script>
function setOptions(chosen) {
var selbox = document.myform.service;
 
selbox.options.length = 0;
if (chosen == " ") {
  selbox.options[selbox.options.length] = new Option('Please select one of the options above first',' ');
 
}
if (chosen == "1") {
  selbox.options[selbox.options.length] = new Option('11','11');
  selbox.options[selbox.options.length] = new Option('12','12');
  selbox.options[selbox.options.length] = new Option('13','13');
}
if (chosen == "2") {
  selbox.options[selbox.options.length] = new Option('21','21');
  selbox.options[selbox.options.length] = new Option('22','22');
  selbox.options[selbox.options.length] = new Option('23','23');
}
}
</script>
</head>
<body>
<form name="myform" method="post" action="submit.php" onSubmit="document.myform.service.options[document.myform.service.selectedIndex].value;">
<table>
 
  <tr><th>Product</th>
	<td>
	<select name="product" size="1" onchange="setOptions(document.myform.product.options[document.myform.product.selectedIndex].value);">
	<option value=" " selected="selected"> </option>
	<option value="1">1</option>
	<option value="2">2</option>
 
	</select>
	</td></tr>
 
  <tr><th>Service</td>
	<td>
	<select name="service" size="1">
	<option value=" " selected="selected">Please select one of the options above first</option>
	</select>
	</td></tr>
 
 
  <tr><th>Amount</th>
	<td><input  id="amount" name="amount"></td></tr>
 
 
  <tr><td><input type="submit" value="Send" name="submit"></td></tr>
</table>
</form>
</center>
</body>
</html>

Open in new window

adamn123Asked:
Who is Participating?
 
MMDeveloperConnect With a Mentor Commented:
try this
<select name="service" size="1" onchange="updateAmt(this)">
        <option value=" " selected="selected">Please select one of the options above first</option>
        </select>
 
 
<script type="text/javascript">
<!--
function updateAmt(el) {
	var amt = "";
	
	switch(el.value) {
		case "11":
			amt = 1;
			break;
		case "12":
			amt = 3;
			break;
		case "13":
			amt = 6;
			break;
	}
	
	if (amt != "") {
		document.getElementById("amount").value = amt;
	} else {}
}
-->
</script>

Open in new window

0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.