dyanimically change form field value based on another field

[jaminbeatty]

Here is my issue, I have a form that I need to dynamically change one of the field values based on the selection from a drop down in the same form. The drop down named "ship_type" contains 4 options - 'Ground', '2nd Day', '1 Day' & 'Electronic'. Based on which option is selected, I then want to dynamically fill in the text field named "ship_paid" with a numeric value associated to each "ship_type" option. For example, if 'Ground' is selected, then I want '40' to be the value of "ship_paid".

Here is the Javascript I have in the head of my file:

<script type="text/javascript"> 
<!-- // 
var ship_rates = { 
 Ground: "25", 
 2nd Day: "40", 
 1 Day: "60", 
 Electronic: "0" 
}; 
// 
function setShip() { 
 var ship_paid = document.getElementById('ship_paid'); 
 var ship_value = ship_paid.orders.elements["ship_type"].value; 
 if (ship_rates[ship_value]) 
 ship_paid.value = ship_rates[ship_value]; 
 else ship_paid.value = "unknown ship value"; 
// --> 
</script> 

And here is (part of) the form:

<form name="orders" id="orders" method="post" action="> 
... 
<td>Ship Type<br /><select name="ship_type" id="ship_type" onChange="setShip()"> 
<option></option> 
<option value="Ground">Ground</option> 
<option value="2nd Day">2nd Day</option> 
<option value="1 Day">1 Day</option> 
<option value="Electronic">Electronic</option> 
</select></td> 
<td>Ship Paid<br /><input name="ship_paid" id="ship_paid" type="text" size="6"></td> 
... 

If anyone out there can help me figure out what I'm missing or doing wrong, it would greatly appreciated. Thanks in advance

[whoisgregg]

Hi jaminbeatty!

The first thing that jumps out at me is that the ship_rates object needs quotes around the keys as well as the values:

var ship_rates = { 
 "Ground": "25", 
 "2nd Day": "40", 
 "1 Day": "60", 
 "Electronic": "0" 
}; 

Also, there is a closing curly brace missing from the setShip() function declaration. That may also be causing an issue.

HTH :)