Filtering dropdown boxes based on a selection

[joesaddigh]

Hi,

 

I have some functionality where a dropdown box is populated based on the selection of the previous one. For example when a coursetitle is selected in one dropdown I only want to see the relevant courselevels in the other dropdown.

 

The problem that I am having is as follows:

 

When the first dropdown is selected the page reloads using a javascript function taking the value and storing it in a variable.

 

The code for this is as follows

 

        <SCRIPT language=JavaScript>
		//Javascript function - Reload page when user selects course dropdown so that values can be repopulated
		function reload(form)
		{
			var val=form.CourseTitle.options[form.CourseTitle.options.selectedIndex].value;
			var val2=form.CourseLevel.options[form.CourseLevel.options.selectedIndex].value;
			self.location='booknow.php?CourseTitle=' + val 
			//self.location='booknow.php?CourseLevel=' + val2;

		}
	</script>

 

 

I have been playing around with it that is why some of the bits of code are commented out.

 

 

The php code which is doing the functionality is below

 

 

<?php
require "connectstudent.php";	
@$coursetitle=$_GET['CourseTitle'];
@$courselevel=$_GET['CourseLevel'];

$querytitle=mysql_query("SELECT DISTINCT CourseTitle FROM course WHERE CourseActive = '' order by CourseTitle");

if(isset($coursetitle) and strlen($coursetitle) > 0)
{
	//Select the course level based on the CourseTitle only select the courses that are active 
	$querylevel=mysql_query("SELECT DISTINCT CourseLevel FROM course WHERE CourseTitle = '$coursetitle' AND CourseActive = ''");
}
else
{
	//Only select the courses that are active 
	$querylevel=mysql_query("SELECT DISTINCT CourseLevel FROM course where CourseActive ='' order by CourseLevel"); 
} 

echo "<form method=post name=f1 action='enrolmentdetails.php'>";
echo "<select name='CourseTitle' onchange=\"reload(this.form)\"><option value=''>Select Course</option>";

while($rowtitle = mysql_fetch_array($querytitle)) 
{
	if($rowtitle['CourseTitle']==@$coursetitle)
	{
		echo "<option selected value='$rowtitle[CourseTitle]'>$rowtitle[CourseTitle]</option>"."<BR>";
	}
	else
	{
		echo  "<option value='$rowtitle[CourseTitle]'>$rowtitle[CourseTitle]</option>";
	}
}

echo "</select>";


//Course level selector
    echo "<label>";
    	echo "<BR>";
	echo "<BR>";
    	echo "Current level of English";
    echo "</label>"; 
       
   
echo "<select name='CourseLevel' onchange=\"reload(this.form)\"><option value=''>Select Title</option>";

while($rowlevel = mysql_fetch_array($querylevel)) 
{ 
	echo  "<option value='$rowlevel[CourseLevel]'>$rowlevel[CourseLevel]</option>";
	//echo  "<option selected value='$rowlevel[CourseLevel]'>$rowlevel[CourseLevel]</option>";
}	

echo "</select>";
?>

 

Currently I can only get the dropdown values to load seperately and if they do they don't stay in as the selected value when the page refreshes. My main goal is for the level to populate based on the first dropdown but when the level is chosen I want to store this in a variable so that I can do a query based on the coursetitle and the level.

 

I really can't figure this one out so if anybody has any suggestions they would be much appreciated.

 

The website address is as follows if you wish to see it as it currently works.

 

www.cisukschool.co.uk/test/booknow.php

 

 

Thanks