Happy Star Wars Day

[ParishYoung]

Happy Star Wars Day!

Hopefully someone is strong in the force and can help.

I have a HTML form and I need to get the user to select one of 350 options.
I have broken down the options into "Major Group", "Sub-Major Group", "Minor Group" and "Unit"
I'm looking to create 4 dynamically changing drop down lists to point the user to their final choice.

All 350 options are in one database table with the following headings:
[Major Group][Major Group Title][SubMajor Group][SubMajor Group Title][Minor Group][Minor Group Title][Unit][Unit Title]

The 'groups' are numeric, and the title's alphanumeric.

I have used the MySQL database to achieve this as it makes it easier to update the 350 options in the future should I need to.

As far as the tutorial over at W3Schools.com has advised I need to use the following process:

HTML Form - <Select> onclick run Javascript function
Javascript function connects to server via PHP
PHP runs query on the MySQL database and returns results
Javascript then populates the 2nd drop down.

and so on through to the final drop down.
There are never more than 9 options in each drop down.

Please can someone help me set this up.

I have been using the code examples from W3Schools.com to put the following together.

I use the alerts to check it's progress. It seems to be getting stuck when checking that the "if (xmlhttp.readystate==4)" line.

Using Safari's built in Debug console the error I get back is that the php file cannot be found and there is a "500 Internal Server Error" - although I think (read as: assume) this is because the "if (xmlhttp.readystate==4)" isn't working.

Any help would be much appreciated.

function selectMajor(str)
	{
	// an alert box to show that both a value has passed and it is the right type
	alert(SOC_Major.value);
	// enable the next drop down - SOC_SubMajor
	document.getElementById('SOC_SubMajor').disabled=false;
	// clear the next select box?
	document.Add_Vacancy.SOC_SubMajor.options.length=0
	// POST to the php script
	// AJAX goes here
	
	if (str=="")
		{
		document.getElementById('SOC_SubMajor').innerHTML=" ";
		alert("str is empty");
		return;
		}
	
	if (window.XMLHttpRequest)
		{ // code for IE7+, Firefox, Chrome, opera, Safari
		xmlhttp=new XMLHttpRequest();
		alert("new XMLHttpRequest created");
		}
	else
		{ // code for IE6, IE5
		xmlhttp=new ActiveXObject('Microsoft.XMLHTTP');
		}
	xmlhttp.onreadystatechange=function()
		{
		if (xmlhttp.readystate==4)
			{ 
			alert(xmlhttp.readystate);
			if(xmlhttp.status==200)
				{
				alert("xmlhttp.status = 200")
				document.getElementById('SOC_SubMajor').innerHTML=xmlhttp.responseText;
				}
			else
  				{ 
     			alert("There was a problem while using XMLHTTP:\n");
  				}
			}
		}
	xmlhttp.open("POST","scripts/SOCSubMajorSelect.php?q="+str,true);
	xmlhttp.send();
	}

[wbport]

May the 4th be with you.