//
function loadBoroughTo(elementName,boroughName,boroughID)
{
	
	var dList=document.getElementsByName(elementName);
	for (i=0;i<dList.length;i++)
	{
		currentList=dList.item(i);
		while ( currentList.length>1)
		{currentList.remove(1);}
	}
	for (j=0; j < dList.length;j++)
	{
			for (i=0;i <boroughName.length;i++)
			{
			var newOption = document.createElement("OPTION");
			newOption.text = boroughName[i];
			newOption.value = boroughID[i];
				currentList=dList.item(j);
				currentList.options.add(newOption);
			}
	}
}
function loadAreaTo(elementName,boroughIndex,areaName,areaID)
{
	var dList=document.getElementsByName(elementName);
	for (i=0;i<dList.length;i++)
	{
		currentList=dList.item(i);
		while ( currentList.length>2)
		{currentList.remove(2);}
	}
	for (j=0; j < dList.length;j++)
	{
			for (i=0;i <areaName[boroughIndex].length;i++)
			{
			var newOption = document.createElement("OPTION");
			newOption.text = areaName[boroughIndex][i];
			newOption.value = areaID[boroughIndex][i];
			
				currentList=dList.item(j);
				currentList.options.add(newOption);
			}
	}
}
function borough_changed(obj,areaObjName,areaName,areaID)
{
	//borough_changed(this,'area',area_name,area_id);
	boroughIndex=obj.selectedIndex-1;//Because there is a default one. therefore, need to minus 1
	loadAreaTo(areaObjName,boroughIndex,areaName,areaID);
}