xxx.js

tumbons = [
	{"province":"Bangkok", "aumper": "thonburi", "tumbon": "klong san" },
	{"province":"Songkhla", "aumper": "hatyai", "tumbon": "swan neck" },
	{"province":"Songkhla", "aumper": "hatyai", "tumbon": "something" }
]


selectable_provinces = ko.computed(function(){
	return tumbons.map(e => e.province)
	              .distinct
})

selectable_aumper = ko.computed(function(){
	return tumbons.filter(e => e.province == selected_province)
				  .map(e => e.aumper)
				  .distinct
})

selectable_tumbons = ko.computed(function(){
	return tumbons.filter(e => e.province == selected_province && e.aumper == selected_aumper)
	              .map(e => e.tumbon)
	              .distinct
})


<select id="province" data-bind="options: selectable_provinces, value: selected_province"/>
<select id="aumper" data-bind="options: selectable_aumper, value: selected_aumper"/>
<select id="tumbon" data-bind="options: selectable_tumbons, value: selected_tumbon"/>