var prefix;
//var city_list;
var callBackChangeCity = false;
var callBackChangeCityStateId = 0;

function UpdateInfo (country,id_prefix){
	prefix = id_prefix;
	if (country == ''){
		var state_obj = document.getElementById(prefix+'_state');
		var city_obj = document.getElementById(prefix+'_city');
		//
		var str1 = '<select name="state" style="width:150px" disabled>';
		str1 += '<option value="">no states</option>';
		str1 += '</select>';
		state_obj.innerHTML = str1;
		//
		var str2 = '<select name="city" style="width:150px" disabled>';
		str2 += '<option value="">select city</option>';
		str2 += '</select>';
		city_obj.innerHTML = str2;
		//
		var city_m_obj = document.getElementById(prefix+'_city_manual');
		city_m_obj.disabled = true;
		return;
	}
	var head = document.getElementsByTagName('head').item(0);
    var scriptTag = document.getElementById('loadScript');
    if(scriptTag) head.removeChild(scriptTag);
	script = document.createElement('script');
    script.src = site_url + 'javascripts/cl_'+country+'.js';
	//script.src = site_url + 'citylist.php?cid='+country;
    script.type = 'text/javascript';
    //script.onload = function () { UpdateList(id_prefix); };
    script.id = 'loadScript';
    head.appendChild(script);
}

function UpdateList (){
	if (callBackChangeCity){
		ChangeCity(callBackChangeCityStateId,prefix);
		callBackChangeCity = false;
		return;
	}
	var state_obj = document.getElementById(prefix+'_state');
	var city_obj = document.getElementById(prefix+'_city');
	if (state_list.length > 0){
		var str1 = '<select name="state" style="width:150px" id="state_id" OnChange="ChangeCity(this.value,\''+prefix+'\');" >';
		var i1;
		str1 += '<option value="">select state</option>';
		for (k in state_list){
			str1 += '<option value="'+state_list[k].id+'">'+state_list[k].name+'</option>';
		}
		str1 += '</select>';
		var str2 = '<select name="city" style="width:150px" id="city_id" disabled>';
		str2 += '<option value="">select city</option>';
		str2 += '</select>';
		city_obj.innerHTML = str2;
		var city_m_obj = document.getElementById(prefix+'_city_manual');
		if (city_m_obj)
			city_m_obj.disabled = true;
	}
	else
	{
		var str1 = '<select name="state" style="width:150px" id="state_id" disabled>';
		str1 += '<option value="">select state</option>';
		str1 += '</select>';
		var str2 = '<select name="city" style="width:150px" id="city_id">';
		str2 += '<option value="">select city</option>';
		var i1;
		for (k in city_list){
			str2 += '<option value="'+city_list[k].id+'">'+city_list[k].name+'</option>';
		}
		str2 += '</select>';
		city_obj.innerHTML = str2;
		var city_m_obj = document.getElementById(prefix+'_city_manual');
		if (city_m_obj)
			city_m_obj.disabled = false;
	}
	state_obj.innerHTML = str1;
}

function ChangeCity (state,id_prefix){
	// if city_list array does not exist!
	// alert(city_list);
	if (typeof city_list == 'undefined'){
		var id_country = document.getElementById(id_prefix+'_country_id').value;
		callBackChangeCity = true;
		callBackChangeCityStateId = state;
		UpdateInfo(id_country,id_prefix);
		return;
	}
	// update <select>'s
	var city_obj = document.getElementById(prefix+'_city');
	var city_m_obj = document.getElementById(prefix+'_city_manual');
	if (state == ''){
		var str2 = '<select name="city" style="width:150px" id="city_id" disabled>';
		str2 += '<option value="">select city</option>';
		str2 += '</select>';
		city_obj.innerHTML = str2;
		//
		if (city_m_obj)
			city_m_obj.disabled = true;
		return;
	}
	var str2 = '<select name="city" style="width:150px" id="city_id">';
	str2 += '<option value="">select city</option>';
	var i1;
	for (k in city_list){
		if (city_list[k].state_id == state){
			str2 += '<option value="'+city_list[k].id+'">'+city_list[k].name+'</option>';
		}
	}
	str2 += '</select>';
	city_obj.innerHTML = str2;
	if (city_m_obj)
		city_m_obj.disabled = false;
}