Help with auto populating a dropdown for form

I know you can populate a form dropdown with data from a database based on the selection of another dropdown with Ajax.

I don't have any experience with Ajax, but I need to get this project done for my work.

If anyone cane help me with this I'd really appreciate it.

Here is the code for my first dropdown.

PHP Code:

---

<?php 
    $flight_sql = "SELECT * FROM wp_flr_flights"; 
    $flight_result = mysql_query($flight_sql); 
    echo '<select name="location">'; 
    while ($flt_loc_rows = mysql_fetch_assoc($flight_result)) { 
        $loc_id = $flt_loc_rows["location_id"]; 
        $loc_name = $flt_loc_rows["location_name"]; 
        echo ''<option value="'.$loc_id.'">'.$loc_name.'</option>''; 
    } 
    echo '</select>'; 
?>

---

So what I want to happen, is when the dropdown is selected the next three dropdowns on the form are populated based in the $loc_id variable.
SO every row in the table with (let's say) and $loc_id of 1. The form gets populated on with information from those rows.

I hope that make sense. I apologize if I posted in the wrong area. I'm not sure if this should be PHP or JavaScript.

Thanks in advanced

OK, I found a tutorial online that I mostly understand but the javasrcript doesn't seem to work.

here's the code

Code:

---

<script>
function changeSecond(first){
        var xmlhttp;
        if (window.XMLHttpRequest){// code for IE7+, Firefox, Chrome, Opera, Safari
                xmlhttp=new XMLHttpRequest();
        } else {// code for IE6, IE5
                xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
        }
        xmlhttp.onreadystatechange=function(){
                if (xmlhttp.readyState==4 && xmlhttp.status==200){
                        var res=xmlhttp.responseText;
                        document.getElementById("second").innerHTML=res;
                }
        }
        xmlhttp.open("GET","reservations-plane.php?first="+first,true);
        xmlhttp.send();
}
</script>
<?php
        $flight_sql = "SELECT * FROM wp_flr_flights";
        $flight_result = mysql_query($flight_sql);
        echo '<select name="location" id="select-location onChange="changeSecond(this.value)">';
        echo '<option value="">Select</option>';
        while ($flt_loc_rows = mysql_fetch_assoc($flight_result)) {
                $loc_id = $flt_loc_rows["location_id"];
                $loc_name = $flt_loc_rows["location_name"];
                echo '<option value="'.$loc_id.'">'.$loc_name.'</option>';
        }
        echo '</select>';
?>
<div id="second"><select><option value=""></option></select></div>

---

reservations-plane.php

Code:

---

<?php
global $wpdb, $page_url;
$location=mysql_real_escape_string($_REQUEST["first"]);
echo $userid.'ddd';
$flight_sql = "SELECT ".$location." FROM wp_flr_flights GROUP BY ".$location;
$flight_result = mysql_query($flight_sql);
echo '<select name="plane_type_choose">';
while ($flt_plane_rows = mysql_fetch_row($flight_result)) {
        $plain_id = $flt_plane_rows["plane_id"];
        $plane_type = $flt_plane_rows["plane_type"];
        echo '<option value="'.$flt_plane_rows[0].'">'.$flt_plane_rows[0].'</option>';
}
echo '</select>';
?>

---

Like I said this seems simple enough to understand, but the Javascript isn't working. I even stuck an alert in there but couldn't get it to work.

Any ideas about this?