Create a form when a drop down box is changed?

[DataSpy]

I'm very new to ajax and javascript in general so hopefully this isn't a stupid question.  What I want to happen is when a drop down box is changed I want a form to materialize, obviously a different form for a different selection.

 

flow chart kind of thing

drop down box >> make selection (onchange) >> build form without refreshing page

[freelance84]

 

function fillForm(formNameToGet){
//Create an XMLHttpRequest object
if (window.XMLHttpRequest) {
	/*code for IE7+, Firefox, Chrome, Opera, Safari*/
	xmlhttp=new XMLHttpRequest();
}
else{
	/* code for IE6, IE5*/
	xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
/*Create the function to be executed when the server response is ready*/
xmlhttp.onreadystatechange=function(){
	if (xmlhttp.readyState==4 && xmlhttp.status==200){
		document.getElementById('formBox').innerHTML=xmlhttp.responseText;
	}
}
  	/*Send the request off to a file on the server*/
xmlhttp.open("GET","http://www.mysite.net/ajaxProcessor.php?getForm="+formNameToGet,true);
xmlhttp.send();
}

 

 

1 call the function

2 php script receives the variable 'getForm' in the get

3 php then echo's back the html for the form which is captured in the responseText

4 the js then fills the div with id 'formBox' with the html outputted from the php and captured in the responseText.