Populate dropdown from databse depending on other dropdown

Unless you are forcing yourself to use plain javascript I would encourage you to look at jQuery.

Also, I don't know what "I am getting the values and it displys in dropdown, but its not displaying in source code and not getting on form submit." means so I'll just ignore this part and give you the basic idea of dependent drop down selections.

Anyways. Lets say you've got the following drop downs

<select name="option1" id="option1">   <option value="1">Select 1</option></select>
   <option value="2">Select 2


<select name="option2" id="option2">   <option value="">Select</option></select>
</option>

Option 1 has to have some data in it because you need to start the dependent drop downs somehow. So based on that, you'll have an change event tied to option1

$("#option1").change(function(){
	$.ajax({
		url: "Url to however you get data here.php",
		type: "GET",
		dataType: "json",
		contentType: "application/json;charset=utf-8",
		async: true,
	}).success(function(data){
		var options = "<option value=''>Select</option>";
		$(data).each(function(k, v){ 
			options += "<option value='"+v.Value+"'>"+v.Display+"</option>";
		});
		
		$("#option2").html(options);
	}).error(function(){
		// something blew up, show error here
	});
});

So in that code, you make an ajax call to get your data, then inside the .success, you loop over the returned results to create your new options for the option2 drop down.

Disclaimer, I typed this code and didn't run it. The general idea here is correct for dependent drop downs and given I don't know what your data looks like/server side code this is as far as I'll take it. If you need anymore help, here is a google search that has tons of results that can help you accomplish this functionality.

jquery dependent dropdowns php