Selectfeld leeren

messmar

Erfahrenes Mitglied
Hallo,

mit der folgenden Funktion versuche ich einen dynamisch erzeugten Dropdown-Menu zu leeren before ich es mit Daten aus einem Array fülle:

HTML:
function removeAllDates() {
		  while(document.cars.autoModell.length>0)
		{
			document.cars.autoModell.options[document.cars.autoModell.length-1]=null;
		}
}

Diese Funktion, rufe ich anschließend in einer anderen Funktion, die das Array füllt:

HTML:
  function showModell() {
	choosenCar = document.cars.aktAutomarke.options[document.cars.aktAutomarke.options.selectedIndex].value;
	removeAllDates();
	alert(choosenCar);
	
	for(i=0; i<autos.length; i++) {
		
		if (autos[i][0] == choosenCar) {
			//alert(autos[i][0]);
			
			optionen = new Option(autos[i][1]);
			document.cars.autoModell.options[i] = optionen;
			document.cars.autoModell.options[i].value = autos[i][1];
		}
		
	}
	
}

Der Dropdownmenu bekommt zwar die neuen Einträge, aber er behält leere Options innerhalb des Selectobjekts.
Irgendwie greift die Funktion für das Leeren des Dropdownsmenus nicht.


Hat Jemand eine Idee woran es legen könnte?

Hier der Arrayaus dem ich Daten holen:

HTML:
  var autos = new Array
(
new Array('Alfa Romeo','147','1,6 T.Spark 105PS 3T'),
new Array('Alfa Romeo','147','1,6 T.Spark 105PS 5T'),
new Array('Aston Martin','Vanquish','V12 S'),
new Array('Audi','A2','1,2 TDI'),
new Array('Audi','A2','1,4'),
new Array('Audi','A2','1,4 TDI (75PS)'),
new Array('Audi','A2','1,4 TDI (90PS)'),
new Array('Audi','A2','1,6 FSI'),
new Array('VW','Touran','1,9 TDI PD (90PS)'),
new Array('VW','Touran','2,0 FSI'),
new Array('VW','Touran','2,0 TDI PD')
);

Vielen Dank und Gruss
Messmart
 
Der Fehler liegt nicht beim Leeren(das geht übrigens auch einfacher per
document.cars.autoModell.options.length=0;)
....sondern beim Füllen.

Da du den kompletten autos-Array durchgehst, fügst du die Optionen auch mit dem entsprechenden index ein.... wenn du in einen JS-Array ein Element #5 einfügst, dann existieren automatisch auch dessen Elemente #0-#4, auch wenn du diese nicht selbst erstellt hast.

Probiers stattdessen mal so:
Code:
if (autos[i][0] == choosenCar)
  {
    document.cars.autoModell.options[document.cars.autoModell.options.length] =
    new Option(autos[i][1],autos[i][1]);
  }
 
Hallo Sven,

danke schon Mal.

Prima, es funktioniert. Irgendwie wusste ich schon, dass es nicht mit dem Leeren zu tun hat, sondern eher wie Du sagtest mit dem Füllen. Aber das konnte ich einfach nicht sehen.

Manchmal braucht man einfach andere Leute, um den Fehler zu finden.


Danke und Gruß
Messmar
 
Hallo,

aber eine Frage hätte ich noch:

wie kann ich rausfinden, ob ein Wert aus dem Array sich wiederholt, damit ich denn die redunanten Werte entferne.

z.B. wenn ich aus dem folgenden Array den zweiten Wert auslese, dann will ich in dem Dropdown nur die zwei Wete Clio Storia und Espace haben und nicht drei Mal Clio Storia
und drei Mal Espace.

Code:
var autos = new Array
(
new Array('Renault','Clio Storia','1,2 5T'),
new Array('Renault','Clio Storia','1,5 dCi 3T'),
new Array('Renault','Clio Storia','1,5 dCi 5T'),
new Array('Renault','Espace','1,9 dCi'),
new Array('Renault','Espace','2,0 16V'),
new Array('Renault','Espace','2,0 T')
);


Danke und Gruß
Messmar
 
wenn der autos-Array wirklich immer so sortiert ist, als erst nach dem 1. Array-Element, und dann nach dem 2., könntest du dir mit einer Variable helfen, in welcher du das 2. Element speicherst.
Vor dem Einfügen der Option schaust du dann nach, ob Variable und 2. Element des Arrays identisch sind...wenn ja, machst du nix.

Ist die Sortierung so nicht sichergestellt, könnte dir ein weiterer Array helfen, in dem du jeweils alle 2.Elemente ablegst und dort nachschaust, ob sie schon vorhanden sind.
 
Hallo,

über ein weiteres Array, habe ich mir gedacht und es wird damit auch funkt, aber ich möchte gerne eine elegantere Lösung verwenden und will ich auch ein Paar Sekunden sparen wo den zweiten Array auch ausgerlesen wird.

Folgendes, habe ich mir ausgedacht, aber ich bekomme beim zweiten aAlert() nichts raus. Ich glaube, dass ich das ertste Eelment des Selectboxes icht mit: 0 ansprechen kann.

Beim ersten alert(); bekomme ich: object, was auch richtig ist.

Code:

HTML:
   function showModell() {		
	this.choosenCar = document.cars.aktAutomarke.options[document.cars.aktAutomarke.options.selectedIndex].value;
	
	alert(choosenCar);
	document.cars.autoModell.options.length=0;
	for(i=0; i<autos.length; i++) {
		if (autos[i][0] == choosenCar){
			document.cars.autoModell.options[document.cars.autoModell.options.length] =
		    new Option(autos[i][1],autos[i][1]);
		}
	}
	
	var seen= new Array();
	this.choosenModell1 = document.cars.autoModell.options;
	for (var k = choosenModell1.length; k--;) {
	  alert(choosenModell1[k]);
	  if ( 0 == seen[ choosenModell1[k] ]++ ) {
	    // Dieser Eintrag ist neu
		alert(choosenModell1[k]);
		// Hier also hinzufügen
	  }
	  else {
	    // Dieser Eintrag trat zum seen[ liste[i] ]ten Male auf
	  }
	}
	
}

Danke und Gruß
Amin
 
Umgebaut und funkt in Firefox, aber in IE folgende Fehlermeldung:
"Bezeichner,Zeichenfolge oder Zahl erwartet"

Javascript-Code:
HTML:
  var autos= {
	'Alfa Romeo' : {
		'Sportwagon' : [
			'1,6 T.Spark',
			'1,8 T.Spark',
			'1,9 JTD',
			'1,9 JTD 16V M-JET',
			'2,0 JTS',
			'2,4 JTD 20V M-JET',
			'2,5 V6 24V',
			'3,2 V6 24V GTA'
		]
	},
	'Aston Martin' : {
		'V8 Vantage' : [
			'4,3 V8'
		],
		'DB7' : [
			'GT',
			'GT A',
			'Vantage Coupé',
			'Vantage Volante'
		],
		'Vanquish' : [
			'V12',
			'V12 S'
		],
		'DB9' : [
			'Coupé',
			'Volante'
		]
	}
	
}


function init( selection ) {
	var i= selection.options.length;
	for ( var marke in autos ) {
		selection.options[i++]= new Option( marke );
	}
}

function showModell( selection, variante, marke ) {
	var i= selection.options.length= variante.options.length= 1;
	for ( var modell in autos[ marke ] ) {
		selection.options[i++]= new Option( modell );
	}
}

function showVariante( selection, marke, modell ) {
	var i= selection.options.length= 1;
	for ( var j=0 ; j < autos[ marke ][ modell ].length ; ++j ) {
		selection.options[i++]= new Option( autos[ marke ][ modell ][ j ] );
	}
}

Html-Code:

HTML:
  <html>
<head>
	<title>Untitled</title>
	<script src="function.js" type="text/javascript" language="JavaScript"></script>
</head>

<body onload="init( document.cars.aktAutomarke );">

<form name="cars" method="post" target="_blank">
	<fieldset id="formDefault">
		<legend>Ihre gesamte Daten</legend>
		<label>Vorname:</label><input type="text" name="name" value="" />
		<br />
		<label>Nachname:</label><input type="text" name="mail" value="" />
		<br />
		<label class="aktAutoMarkeModell">Aktuelle Automarke:</label>
		<select name="aktAutomarke" id="automarke" onChange="showModell( this.form.autoModell, this.form.autoVariante, this.value );">
			<option value="" selected="selected"></option>
		</select>
		<br />
		<label class="aktAutoMarkeModell">Aktuelles Modell:</label>
		<select name="autoModell" id="automodellA" onChange="showVariante( this.form.autoVariante, this.form.automarke.value, this.value);">	
			<option value="" selected="selected"></option>
		</select>
		<br />
		<label class="neuAutoMarkeModell">Marke neues Auto:</label>
		<select name="autoVariante" id="neuesAutoMarke">
			<option value="" selected="selected"></option>
		</select>
		
		<br /><br />
		<input type="Submit" value="Senden" style="width:100px;">
	</fieldset>
</form>


</body>
</html>

Jemand eine Idee. Komme wieder nicht weiter.

Vielen Dank und Gruß
Messmar
 
Stop.

das zweite Argument bei dem new Option() muss ein weiteres bzw. zweites Argument enthalten und zwar das für value.

also:
HTML:
function init( selection ) {
...
    selection.options[i++]= new Option( marke, marke );
...
}

function showModell( selection, variante, marke ) {
...
 selection.options[i++]= new Option( modell, modell );
...
}

function showVariante( selection, marke, modell ) {
...
 selection.options[i++]= new Option( autos[ marke ][ modell ][ j ], autos[ marke ][ modell ][ j ] ); ... }

Und der Komma am Ende des Arrays, musste entfernt werden und damit funkt auch unter IE.

Grüße
Messmar
 
Zuletzt bearbeitet:

Neue Beiträge

Zurück