3 listbox ajax dropdown with reload(this.form)

[cabalsdemon]

what i am trying to do is have 3 listbox that reload as you click them but the 3rd dropdown list upon click is not reloading can someone help please

 

here is my js script

 

function reload(form)
{
var val=form.state.options[form.state.options.selectedIndex].value;
self.location='homes.php?state=' + val;
}
function reload1(form)
{
var val=form.state.options[form.state.options.selectedIndex].value;
var val2=form.county.options[form.county.options.selectedIndex].value;
self.location='homes.php?state=' + val + '&county=' + val2;
}
function reload2(form)
{
var val=form.state.options[form.statet.options.selectedIndex].value;
var val2=form.county.options[form.county.options.selectedIndex].value;
var val3=form.city.options[form.city.options.selectedIndex].value;
self.location='homes.php?state=' + val + '&county=' + val2 + '&city=' + val3;
}

 

and here is my php/html script

 

<? 
include'admin/configs/configs.php'; 
@$state=$_REQUEST['state']; 
@$county=$_REQUEST['county']; 
@$city=$_REQUEST['city']; 

$quer2=mysql_query("SELECT DISTINCT state,id FROM states");  

if($state){ 
$quer=mysql_query("SELECT DISTINCT * FROM county where state='$state'"); } 

$quer3=mysql_query("SELECT DISTINCT * FROM cities where county='$county'");  

echo "<form method=post name=f1 action='homes.php?state=$state&county=$county'>"; 


echo "<select name='state' onchange=\"reload(this.form)\"><option value=''>Select one</option>"; 
while($mbfh2 = mysql_fetch_array($quer2)) {  
if($mbfh2['state']==@$state){echo "<option selected value='$mbfh2[state]'>$mbfh2[state]</option>"."<BR>";} 
else{echo "<option value='$mbfh2[state]'>$mbfh2[state]</option>";} 
} 
echo "</select>"; 

echo "<select name='county' onchange=\"reload1(this.form)\"><option value=''>Select one</option>"; 
while($mbfh = mysql_fetch_array($quer)) {  
if($mbfh['county']==@$county){echo "<option selected value='$mbfh[county]'>$mbfh[county]</option>"."<BR>";} 
else{echo "<option value='$mbfh[county]'>$mbfh[county]</option>";} 
} 
echo "</select>"; 

echo "<select name='city' onchange=\"reload2(this.form)\"><option value=''>Select one</option>"; 
while($mbfh3 = mysql_fetch_array($quer3)) {  
if($mbfh3['city']==@$city){echo "<option selected value='$mbfh3[city]'>$mbfh3[city]</option>"."<BR>";} 
else{echo "<option value='$mbfh3[city]'>$mbfh3[city]</option>";} 
} 
echo "</select>"; 

echo "<input type=submit value=Submit>"; 
echo "</form>"; 

?>

[smoseley]

"selectedIndex" is a property of the select element, not the options list.

 

Change these:

 

form.state.options.selectedIndex

 

to something like this:

 

form.state.selectedIndex

[smoseley]

By the way, that's not AJAX.

[cabalsdemon]

ok i apologize about that , I was told it was ajax .

I thank you very much i will try this