Dynamisches Dropdown

E

engelolli

Grünschnabel
HiHo,

ich hab da ein Prob mit einem dynamischem Dropdownmenü.
Und zwar das Script soweit, leider stellt es nur das "Option" um, aber nicht nicht das "value".
Da ich aber daten aus einer DB auslese, und dafür die ID benötige, brauche ich diese in der Value.
Kannich das mitgeben irgendwie?
hHer mal mein Script:
Code: 
<html>
<head>
<title>Login Test</title>
<script language="javascript">
<!-- Start
function update_auswahl_location()
	{
	var personAuswahl = document.forms.login.person;
	var locationAuswahl = document.forms.login.location;
	var departmentAuswahl = document.forms.login.department;
	personAuswahl.options.length = 0; // DropDown Menü entleeren
	departmentAuswahl.options.length = 0; // DropDown Menü entleeren

	if (locationAuswahl.options
	[locationAuswahl.selectedIndex].
	value == "1")
		{
		personAuswahl.options[0] = new Option("Tester 4");
		personAuswahl.options[1] = new Option("Tester 5");
		personAuswahl.options[1] = new Option("Tester 6");
		departmentAuswahl.options[0] = new Option("Departemtn 4");
		departmentAuswahl.options[1] = new Option("Departemtn 5");
		departmentAuswahl.options[2] = new Option("Departemtn 6");
		}
	else if (locationAuswahl.options
	[locationAuswahl.selectedIndex].
	value == "2")
		{
		personAuswahl.options[0] = new Option("Tester 7");
		personAuswahl.options[1] = new Option("Tester 8");
		personAuswahl.options[2] = new Option("Tester 9");
		departmentAuswahl.options[0] = new Option("Departemtn 7");
		departmentAuswahl.options[1] = new Option("Departemtn 8");
		departmentAuswahl.options[2] = new Option("Departemtn 9");
		}
	else if (locationAuswahl.options
	[locationAuswahl.selectedIndex].
	value == "3")
		{
		personAuswahl.options[0] = new Option("Tester 10");
		personAuswahl.options[1] = new Option("Tester 11");
		personAuswahl.options[2] = new Option("Tester 12");
		departmentAuswahl.options[0] = new Option("Departemtn 10");
		departmentAuswahl.options[1] = new Option("Departemtn 11");
		departmentAuswahl.options[2] = new Option("Departemtn 12");
		}
	}

function update_auswahl_department()
	{
	var personAuswahl = document.forms.login.person;
	var locationAuswahl = document.forms.login.location;
	var departmentAuswahl = document.forms.login.department;
	personAuswahl.options.length = 0; // DropDown Menü entleeren

	if (departmentAuswahl.options
	[departmentAuswahl.selectedIndex].
	value == "1")
		{
		personAuswahl.options[0] = new Option("Tester 4");
		personAuswahl.options[1] = new Option("Tester 5");
		personAuswahl.options[1] = new Option("Tester 6");
		}
	else if (departmentAuswahl.options
	[departmentAuswahl.selectedIndex].
	value == "2")
		{
		personAuswahl.options[0] = new Option("Tester 7");
		personAuswahl.options[1] = new Option("Tester 8");
		personAuswahl.options[2] = new Option("Tester 9");
		}
	else if (departmentAuswahl.options
	[departmentAuswahl.selectedIndex].
	value == "3")
		{
		personAuswahl.options[0] = new Option("Tester 10");
		personAuswahl.options[1] = new Option("Tester 11");
		personAuswahl.options[2] = new Option("Tester 12");
		}
	}
// Ende -->
</script>
</head>
<body>
<form name="login" action="login.asp" method="get">
<select name="person">
<option value="1" selected>Tester 1</option>
<option value="2">Tester 2</option>
<option value="3">Tester 3</option>
</select>
<br>
<br>
<select name="department" onChange="update_auswahl_department()">
<option value="1" selected>Department 1</option>
<option value="2">Department 2</option>
<option value="3">Department 3</option>
</select>
<br>
<br>
<select name="location" onChange="update_auswahl_location()">
<option value="1" selected>Location 1</option>
<option value="2">Location 2</option>
<option value="3">Location 3</option>
</select>
<br>
<br>
<input type="submit" value="Submit" name="Submit">
</form>
</body>
</html>

Gruß, Oliver
 
Ohhh sorry, ich war irgendwie falsch reingekommen...
ich dachte ich wäre noch im Java-Forum (nehme also alles zurück un behaupte das Gegenteil :p )
 
Füge dem Optionskonstruktor als zweites Argument den Optionswert hinzu:
Javascript: 
abc = new Option("Tester 4","123");
Ansonsten findest du hier die passende SelfHTML-Seite.

Ceppi
 
Du könntest natürlich die Options einzeln ansprechen und ihren value über den Konstruktor ändern, aber die Mehtode ist nicht empfehlenswert.

Wenn du sowieso eine Datenbank und damit eine serverseitige Sprache benutzt gibt es eine deutlich elegantere Lösung für dich. Du schreibst alle Dropdownmenüs per serverseitiger Sprache in deine hmlt-Datei. Die dich nicht zu sehen sein sollen versteckst du über style="display:none" und machst das richtige je nach Auswahl in deinem Hauptfeld wieder sichtbar.

Nicht verstanden? Kein Problem, hier ein Beispiel: http://www.tutorials.de/forum/javascript/214587-dynamische-formularelemente.html#post1117599
 
Um antworten zu können musst du eingeloggt sein.

Neue Beiträge

Zurück