$(document).ready(function() {

	$("#areaProvince").change(function() {
		LoadCity();
		LoadCounty();
	});

	$("#areaCity").change(function() {
		LoadCounty();
	});

});

function LoadArea(prov, city, County) {
	LoadProvince(prov);
	LoadCity(city);
	LoadCounty(County);

}
function LoadArea1(prov, city) {
	LoadProvince(prov);
	LoadCity(city);
}
function LoadProvince(values) {
    try{
	    $("#areaProvince").empty();
	    for (var id in countryAreaData) {
		    $("#areaProvince").append(" <option value='" + id + "'>" + id + "</option>");

	    }
	    if (typeof(values) == "string") {
		    $("#areaProvince option[value^=" + values + "]").eq(0).attr("selected", true);
	    }else
	        $("#areaProvince option").eq(0).attr("selected", true);
	}catch(e){}
}
function LoadCity(values) {
    try{
	    $("#areaCity").empty();
	    $("#areaCounty").empty();
	    var s1 = $("#areaProvince option:selected").val();
	    for (var id2 in countryAreaData[s1]) {

		    $("#areaCity").append(" <option value='" + id2 + "'>" + id2 + "</option>");
	    }
	    if (typeof(values) == "string") {
		    $("#areaCity option[value^=" + values + "]").eq(0).attr("selected", true);
	    }else
	        $("#areaCity option").eq(0).attr("selected", true);
	}catch(e){}
}
function LoadCounty(values) {
    try{
	    $("#areaCounty").empty();
	    var str1 = $("#areaProvince option:selected").val();
	    var str2 = $("#areaCity option:selected").val();

	    for (i = 0; i < countryAreaData[str1][str2].length; i++) {
		    str = countryAreaData[str1][str2][i];

		    $("#areaCounty").append(" <option value='" + str + "'>" + str + "</option>");

	    }
	    if (typeof(values) == "string") {
		    $("#areaCounty option[value^=" + values + "]").eq(0).attr("selected", true)
	    }else
	        $("#areaCounty option").eq(0).attr("selected", true);
	}catch(e){}
}