var xmlHttp

function chCountry(url_link,id,link_ch_region){
	if(id=="id"){
		document.getElementById("detail_country").innerHTML=''+
		'<table width="100%" cellpadding="0" cellspacing="0">'+
		'<tr class="genap">'+
			'<td width="30%">Provinsi</td>'+
			'<td width="2%">:</td>'+
			'<td>'+
				'<select name="cbRegion" id="cbRegion" onChange="chRegion(\''+link_ch_region+'\',this.value); ckSelect(this)">'+
				'<option value="0">&lsaquo;&lsauo; pilih &rsaquo;&rsaquo;</option>'+
			'</select>'+
			'</td>'+
		'</tr>'+
		'<tr class="ganjil">'+
			'<td>Kota/Kabupaten</td>'+
			'<td>:</td>'+
			'<td>'+
			'<select name="cbCity" id="cbCity" onChange="ckSelect(this)">'+
				'<option value="0">&lsaquo;&lsaquo; pilih &rsaquo;&rsaquo;</option>'+
			'</select>'+
			'</td>'+
		'</tr>'+
		'</table>';
		
		if (id.length==0){ 
			document.getElementById("cbRegion").innerHTML="";
			return;
		}
		
		xmlHttp=GetXmlHttpObject();
		if (xmlHttp==null){
			alert ("Your browser does not support AJAX!");
			return;
		}
		
		var url="";
		url=url_link+id;
		
		xmlHttp.onreadystatechange=stateChangedCountry;
		xmlHttp.open("GET",url,true);
		xmlHttp.send(null);
	} else { document.getElementById("detail_country").innerHTML=''; }
} 

// state 4.. do it
function stateChangedCountry() { 
	if (xmlHttp.readyState==4){ 
		var inner = xmlHttp.responseText;
		select_innerHTML(document.getElementById("cbRegion"),inner);
	} else { document.getElementById("cbRegion").innerHTML="<option style='font-style:italic;'>loading..</option>"; }
}

function chRegion(url_link,id){
	if (id.length==0){ 
		document.getElementById("cbCity").innerHTML="";
	  	return;
	}
	
	xmlHttp=GetXmlHttpObject();
	if (xmlHttp==null){
		alert ("Your browser does not support AJAX!");
	  	return;
	}
	
	var url="";
	url=url_link+id;
	
	xmlHttp.onreadystatechange=stateChangedRegion;
	xmlHttp.open("GET",url,true);
	xmlHttp.send(null);
	
} 

// state 4.. do it
function stateChangedRegion() { 
	if (xmlHttp.readyState==4){ 
		var inner = xmlHttp.responseText;
		select_innerHTML(document.getElementById("cbCity"),inner);
	} else { document.getElementById("cbCity").innerHTML="<option style='font-style:italic;'>loading..</option>"; }
}


function GetXmlHttpObject(){
	var xmlHttp=null;
	try{
  	// Firefox, Opera 8.0+, Safari
  		xmlHttp=new XMLHttpRequest();
  	}catch (e){
  		// Internet Explorer
  		try{
    		xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
    	}catch (e){
    		xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
    	}
  	}
	
	return xmlHttp;
	
}


// use for combo 
function select_innerHTML(objeto,innerHTML){
/******
* select_innerHTML - corrige o bug do InnerHTML em selects no IE
* Veja o problema em: http://support.microsoft.com/default.aspx?scid=kb;en-us;276228
* Version: 2.1 - 04/09/2007
* Autor: Micox - N�iron Jos� C. Guimar�es - micoxjcg@yahoo.com.br
* @objeto(tipo HTMLobject): o select a ser alterado
* @innerHTML(tipo string): o novo valor do innerHTML
*******/
	objeto.innerHTML = ""
	var selTemp = document.createElement("micoxselect")
	var opt;
	selTemp.id="micoxselect1"
	document.body.appendChild(selTemp)
	selTemp = document.getElementById("micoxselect1")
	selTemp.style.display="none"
	if(innerHTML.toLowerCase().indexOf("<option")<0){//se n�o � option eu converto
		innerHTML = "<option>" + innerHTML + "</option>"
	}
	innerHTML = innerHTML.replace(/<option/g,"<span").replace(/<\/option/g,"</span")
	selTemp.innerHTML = innerHTML
	
	for(var i=0;i<selTemp.childNodes.length;i++){
		var spantemp = selTemp.childNodes[i];
		if(spantemp.tagName){
			opt = document.createElement("OPTION")
			if(document.all){ //IE
    			objeto.add(opt)
			} else {
			objeto.appendChild(opt)
   		}

			//getting attributes
			for(var j=0; j<spantemp.attributes.length ; j++){
				var attrName = spantemp.attributes[j].nodeName;
				var attrVal = spantemp.attributes[j].nodeValue;
				if(attrVal){
					try{
						opt.setAttribute(attrName,attrVal);
						opt.setAttributeNode(spantemp.attributes[j].cloneNode(true));
					}catch(e){}
				}
			}
			//getting styles
			if(spantemp.style){
				for(var y in spantemp.style){
					try{opt.style[y] = spantemp.style[y];}catch(e){}
				}
			}
			//value and text
			opt.value = spantemp.getAttribute("value")
			opt.text = spantemp.innerHTML
			//IE
			opt.selected = spantemp.getAttribute('selected');
			opt.className = spantemp.className;
		} 
	}
	document.body.removeChild(selTemp)
	selTemp = null
}