Inte ladda om dropdown?

Hejsan!

Jag har ett litet problem som jag skulle behöva hjälp med, det gäller 2 st dropdowns. När jag väljer värde i den första så påverkas den andra men jag skulle behöva ett javaScript som gör så att man inte behöver ladda om sidan. Hur och vad ska klämma in det i följande kod?

<form action="test_drop.asp" method="get" ID="Form1">
<SELECT onchange="location.href='test_drop.asp?picCat='+this.options[this.selectedIndex].value;" ID="Select1" NAME="Select1">
<option>- Kategori -</option>
</SELECT>
</form>

<form action="test_drop.asp" method="get" ID="Form2">
<SELECT onchange="location.href='test_drop.asp?picCat=<%=strPicCat%>&picSub='+this.options[this.selectedIndex].value;" ID="Select2" NAME="Select2">
<option>- Mapp -

</SELECT>
</form>

Någon?

R | Tog bort ASP-kod så det blir lättare att se :)

Allt data som skall kunna visas på sidan måste finnas tillgänglig för ditt JavaScript för att det skall fungera. Här är ett exempel:

<script type="text/javascript">
// Denna bit skapas dynamiskt via ASP från din datakälla på din server...
var db={
	"Kategori 1":["Alternativ 1-1","Alternativ 1-2","Alternativ 1-3"],
	"Kategori 2":["Alternativ 2-1","Alternativ 2-2","Alternativ 2-3"],
	"Kategori 3":["Alternativ 3-1","Alternativ 3-2","Alternativ 3-3"]
}
// ... hit ner.
function update(obj){
	var cat=obj['Select1'][obj['Select1'].selectedIndex].value;
	for(var i in db){
		if(i==cat){
			obj['Select2'].length=db[i].length;
			for(var a in db[i]){
				obj['Select2'][a]=new Option(db[i][a],db[i][a]);
			}
		}
	}
}
window.onload=function(){
	update(document.forms['Form1']);
}
</script>

<form action="test_drop.asp" method="get" id="Form1" name="Form1">

<select onchange="update(this.form);" id="Select1" name="Select1">
<option value="Kategori 1">Kategori 1</option>
<option value="Kategori 2">Kategori 2</option>
<option value="Kategori 3">Kategori 3</option>
</select>

<select onchange="location.href='test_drop.asp?picCat='+this.form.select1[this.form.select1.selectedIndex].text+'&picSub='+this.options[this.selectedIndex].value;" id="Select2" name="Select2">
</select>

</form>