addListener(window, 'load', ajaxState);


function ajaxState(){
	
	state = document.getElementById('state');
	city = document.getElementById('city');
	
	state.onchange = function(){
		city.options[city.selectedIndex].value = "";
		if(state.options[state.selectedIndex].value==""){
			document.getElementById('city').disabled = true;
		} else {
			document.getElementById('city').disabled = false;
		}
		handleStateChange(this);
		return false;
	}
	

	if(state.options[state.selectedIndex].value==""){
		document.getElementById('city').disabled = true;
	} else {
		document.getElementById('city').disabled = false;
	}
}

function handleStateChange(state){
	var val = state[state.selectedIndex].value;
	var searchBox = document.forms["searchBox"];
	var city = document.getElementById('city');

	if (val != ""){
		Http.get({
			url: "./index.php?action=getCity&state=" + val,
			callback: fillCity,
			cache: Http.Cache.Get
		}, [city]);
	}
}

function fillCity(xmlreply, city)
{
  if (xmlreply.status == Http.Status.OK)
  {
	var stateresponse = xmlreply.responseText;
	var state = stateresponse.split("|");
	city.length = 1;
	city.length = state.length;
	for (i=1; i < state.length; i++)
	{
	  city[i].text = state[i];
	}
  }
}