var xmlHttp

//The purpose of the function is to solve the problem of creating different XMLHTTP objects for different browsers.
function GetXmlHttpObject(){
	try { // Opera 8.0+, Firefox, Safari
		xmlHttp = new XMLHttpRequest();
	}
	catch (e) { // Internet Explorer Browsers
		try {
			//IE 6 +
			xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");
		}
		catch (e) { //IE 5.5
			xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
		}
	}
	return xmlHttp;
}

function stateChanged(){
	if (xmlHttp.readyState==4){
		//lets get a grip on the ASP-generated XML document using some DOM
		var xmlDoc = xmlHttp.responseXML.documentElement;
		
		//check if any car models exist..ie if the XML document returned an <empty> element then we assume no models exist
		var empty = xmlDoc.getElementsByTagName('empty');
		if (empty.length){
			//get a handle to our car models menu
			var model_options = document.find_part.model;
			
			//remove all options by setting the options array's length to 0
			model_options.options.length=0;
			//model_options.options[0]=new Option("Models unavailable","",true, false);
			model_options.options[0]=new Option("Other Model","other",true, false);
			toggleLayer( 'location_div', 'other');
		}
		else{
			//get a handle to our car models menu
			var model_options = document.find_part.model;
			
			//remove all options in the car models menu by setting the options array's length to 0
			model_options.options.length=0;
			
			//declare some variables
			var model;
			
			//how many car models (i.e. XML elements) did our XML document return?
			var length = xmlDoc.getElementsByTagName('model').length;

			model_options.options[0]=new Option("Select a car model", "", false, false);
			
			// populate the select menu with new options, using the Option() constructor on each option. Loop through based on how many car models we have
			for (var i=0; i < length; i++) {	
				model = xmlDoc.getElementsByTagName("model")[i].childNodes[0].nodeValue;
				model_options.options[i+1]=new Option(model, model, false, false);
			}
			model_options.options[i+1]=new Option("Other Model","other",false, false);
			toggleLayer( 'location_div', '');
			
		}//else
	}//if (xmlHttp.readyState==4)
}

function getModels(make,year){
	if (make == ""){
		//get a handle to our car models menu
		var model_options = document.find_part.model;
		
		//remove all options by setting the options array's length to 0
		model_options.options.length=0;
		model_options.options[0]=new Option("Models not found","",true, false);
	}
	else{
		//create object via function call
		xmlHttp=GetXmlHttpObject();
		if (xmlHttp==null){
			alert ("Your browser does not support AJAX!");
			return;
		}

		//create querystring to our ASP page - pass the 'id' of the selected car maker
		var url="/get_car_models.php?make=" + make + "&year=" + year;
		
		//make request, specify response function and send request
		xmlHttp.open("GET",url,true);
		xmlHttp.onreadystatechange=stateChanged;
		xmlHttp.send(null);
	}
	
}

function selectModel(){
	toggleLayer( 'location_div', document.find_part.model.value);
}

function toggleLayer( whichLayer, model )
{
  var elem, vis;
  if( document.getElementById ) // this is the way the standards work
    elem = document.getElementById( whichLayer );
  else if( document.all ) // this is the way old msie versions work
      elem = document.all[whichLayer];
  else if( document.layers ) // this is the way nn4 works
    elem = document.layers[whichLayer];
  vis = elem.style;
  // if the style.display value is blank we try to figure it out here
  if(vis.display==''&&elem.offsetWidth!=undefined&&elem.offsetHeight!=undefined)
    vis.display = (elem.offsetWidth!=0&&elem.offsetHeight!=0)?'block':'none';
    if(model=="other" && document.find_part.year.value!=""){
	vis.display = 'block';
    }else{
	vis.display = 'none';	
    }
}

function toggleLayers( whichLayer )
{
	if(whichLayer==1){
		toggleLayerOn( 'location_div');
		toggleLayerOff( 'location_div2');		
	}else if(whichLayer==2){
		toggleLayerOn( 'location_div2');
		toggleLayerOff( 'location_div');		
	}
}

function toggleLayerOn( whichLayer)
{
  var elem, vis;
  if( document.getElementById ) // this is the way the standards work
    elem = document.getElementById( whichLayer );
  else if( document.all ) // this is the way old msie versions work
      elem = document.all[whichLayer];
  else if( document.layers ) // this is the way nn4 works
    elem = document.layers[whichLayer];
  vis = elem.style;
  // if the style.display value is blank we try to figure it out here
  if(vis.display==''&&elem.offsetWidth!=undefined&&elem.offsetHeight!=undefined)
    vis.display = (elem.offsetWidth!=0&&elem.offsetHeight!=0)?'block':'none';
	vis.display = 'block';
}
function toggleLayerOff( whichLayer)
{
  var elem, vis;
  if( document.getElementById ) // this is the way the standards work
    elem = document.getElementById( whichLayer );
  else if( document.all ) // this is the way old msie versions work
      elem = document.all[whichLayer];
  else if( document.layers ) // this is the way nn4 works
    elem = document.layers[whichLayer];
  vis = elem.style;
  // if the style.display value is blank we try to figure it out here
  if(vis.display==''&&elem.offsetWidth!=undefined&&elem.offsetHeight!=undefined)
    vis.display = (elem.offsetWidth!=0&&elem.offsetHeight!=0)?'block':'none';
	vis.display = 'none';
}