Hi all,

The below Javascript code is not working correctly. When the user selects from a select menu a related field is to be populated with the relevant data.
The same is to happen with another form field. However only one field works properly.

Can anyone spot where I'm going wrong?

Thanks.

PHP Code:
       <?php
         
         
// 1) Get all Investment Types
         
$query "SELECT investment_type_ID, investment_type, inv_note ".
                           
"FROM investment_type";
         
$result mssql_query($query) or die('Select Error');
         
         
$type_array = array();
         
$id_array = array();
 
         while(
$row mssql_fetch_assoc($result))
         {
                          
// option string
                         
$option .= '<option value="'.$row['investment_type_ID'].'">'.$row['investment_type'].'</option>';
 
                         
// arrays to build javascript array string
                         
$type_array[] = addslashes($row['inv_note']); //addslashes for javascript escape
                         
$id_array[] = $row['investment_type_ID'];
         }
// end while
         
         //create string for javascript assoc array format. "key1:value1", "key2:value2", ........
         
for($i=0$i sizeof($id_array); $i++)
         {
                      
$javascript_array[$i] = '"'.$id_array[$i].'":"'.$type_array[$i].'"';  
     }
         
?>
         
         <script language="JavaScript">
     <?php
     
//echo javascript array var notes = {"key1:value1", "key2:value2", ...}
     
echo 'var notes = {'.implode(',',$javascript_array).'};';
         
?>
 
         function change(id) 
         {
     document.getElementById('inv_type_note').innerHTML = notes[id];
         }
     </script>
         
     <p>
       <label for="investment_type">Investment Type</label>
             <select name="investment_type" id="investment_type" onchange="change(this.options[selectedIndex].value);">
           <option value="0">Select Investment Type</option>
           <?php
                      
echo $option;
           
?>
             </select>
     </p>
         
     <p>
           <label for="inv_type_note">Note</label>
       <textarea cols="55" rows="5" name="inv_type_note" id="inv_type_note">
             </textarea>
     </p>
 
  
         
   <?php
         
         
// 2) Get all Country Codes
         
$query2 "SELECT country_ID, country_name, code ".
                           
"FROM issue_country";
         
$result2 mssql_query($query2) or die('Select Error');
         
         
$type_array2 = array();
         
$id_array2 = array();
 
         while(
$row2 mssql_fetch_assoc($result2))
         {
                          
// option string
                         
$option2 .= '<option value="'.$row2['country_ID'].'">'.$row2['country_name'].'</option>';
 
                         
// arrays to build javascript array string
                         
$type_array2[] = addslashes($row2['code']); //addslashes for javascript escape
                         
$id_array2[] = $row2['country_ID'];
         }
// end while
         
         //create string for javascript assoc array format. "key1:value1", "key2:value2", ........
         
for($i=0$i sizeof($id_array2); $i++)
         {
                      
$javascript_array2[$i] = '"'.$id_array2[$i].'":"'.$type_array2[$i].'"';
     }
         
?>
         
         <script language="JavaScript">
     <?php
     
//echo javascript array var notes = {"key1:value1", "key2:value2", ...}
     
echo 'var codes = {'.implode(',',$javascript_array2).'};';
         
?>
 
         function change2(id) 
         {
     document.getElementById('issue_country_code').innerHTML = codes[id];
         }
     </script>
         
     
     <div class="row">    
     <p>
       <label for="issue_country">Issue Country</label>
             <select name="issue_country" id="issue_country" onchange="change2(this.options[selectedIndex].value);">
           <option value="0">Select Issue Country</option>
           <?php
                      
echo $option2;
           
?>
             </select>
     </p>
         
     <p>
       <label for="issue_country_code">Issue Country Code</label>
       <input type="text" name="issue_country_code" id="issue_country_code" value="" />
     </p>
     </div>