var optionsloaded = false;
var option_ids;
var option_values;
var option_texts;

var oSelect1;
var oSelect2;

function Select1_onload() // could be tied to page load
{
	// do once only
	if (!optionsloaded)
	{
		assignValsToArray();
			
		
		// if no select1 item is selected, select the first item
		// call Select1_onchange()
		
		if ( optionsloaded || (oSelect1.selectedIndex != 0) )
		{
			Select1_onchange( true );
		} else
			loadAllDistricts();
			
		// set optionsloaded = true
		optionsloaded = true;
	}
}

function Select1_onchange( loadedFromBody )
{
	// load appropriate options into oSelect2
	// get the oSelected group
	var groupname = oSelect1.options[oSelect1.selectedIndex].id;	
	
	if (groupname != null)
	{
		// add items to the list
		if (oSelect1.selectedIndex == 0)
		{
			loadAllDistricts();		
		}
		else
		{
			loadDistForRegion( groupname, loadedFromBody );
		}
	}
}


function assignValsToArray() {
	// assign brower compat
	oSelect1 = document.getElementById("Select1");
	oSelect2 = document.getElementById("Select2");
	
	// copy all the options to an array for future use
	option_ids = new Array();
	option_values = new Array();
	option_texts = new Array();
	
	for (i = 0; i < oSelect2.length; i++)
	{
		option_ids[i] = oSelect2.options[i].id;
		option_values[i] = oSelect2.options[i].value;
		option_texts[i] = oSelect2.options[i].text;
	}
}

function loadAllDistricts() {
	var oSelect2Selected = oSelect2.selectedIndex;
	var selectedVal = oSelect2.options[oSelect2Selected].value;
	
	clearItems();
	//var previousElement = "";
	
	// add all items to the second select excluding All (first item).
	var counter = 1;
	for (i = 1; i < option_ids.length; i++)
	{
		// create a new option element
		var oOption = document.createElement("option");
		// assign original values to new element
		oOption.id = option_ids[i];
		oOption.text = option_texts[i];
		oOption.value = option_values[i];
		// add new element to select2 collection
		var isNotInList = true;
		 
		for( x=0; x<oSelect2.length; x++ ) {
			if( oOption.text == oSelect2[x].text ) {
				isNotInList = false;
				break;
			}
		}
		
		if( isNotInList ) {	
			oSelect2[counter++] = oOption;
			//previousElement = oOption.text;
			
			if( oOption.value == selectedVal )	//set the selected index
				oSelect2.selectedIndex = counter - 1;
		}
	}
	
	
}


function loadDistForRegion( groupname, loadedFromBody ) {
//var oSelect2Selected = oSelect2.selectedItem.value;
	var oSelect2Selected = oSelect2.selectedIndex;
	var selectedVal = oSelect2.options[oSelect2Selected].value;
	
	clearItems();
	var counter = 1;
	var selectedInd = 0;
	for( i = 0; i < option_ids.length; i++ )
	{
		// add items where first groupid part of ID (groupid_optionid) == groupname		
		// get the group name
	
		if ( option_ids[i].substr(0,option_ids[i].indexOf("_")) == groupname )
		{
			// create a new option element
			var oOption = document.createElement("option");
			// assign original values to new element
			
			oOption.id = option_ids[i];
			oOption.text = option_texts[i];
			oOption.value = option_values[i];
			
			// add new element to select2 collection
			oSelect2[counter++] = oOption;
			
			if( oOption.value == selectedVal )	//set the selected index
				oSelect2.selectedIndex = counter - 1;
		}
		
	}
}

function clearItems() {
	// clear the current item list
	for (i = oSelect2.length - 1; i >= 0; i--)
	{
		if( oSelect2.options[i].value != "-9999" ) {
			oSelect2.remove(i);
		}
	}
}