//when the page is load, start init()
Event.observe(window, 'load', init, false);
function init(){
//create listener
	$('prefecture').observe('change', picktown);
	
}
function picktown()
{
	
	var encodeuri = encodeURIComponent(this.value);
	removetown();
	new Ajax.Request('/ajax/pickward',
		{
			method: 'get',
			parameters:{idpref: encodeuri},
			onSuccess: function(transport)
			{ 
				$('town').disabled = false;
				var feedbk = transport.responseJSON;
				//alert(transport.responseText);
				for(i = 0; i < feedbk.length; i++)
				{
					input = document.createElement("option");
					input.value = feedbk[i];
					//input.class = "town_option";
					input.innerHTML = feedbk[i];
					$('town').appendChild(input);
				}
			},
			onFailure: function(){ alert("error occured");}
		});
}

function removetown()
{
	
	list_of_town = $('town').childElements();
	if(list_of_town.length > 1)
	{
		for(j=1;j < list_of_town.length; j++)
		{
			list_of_town[j].remove();
		}
	}
}