✔ Split und dynamische Option-Felder

messmar · 15. Juni 2006

Hi,

ich versuche die ausgwählten Werte eines Dropdown-Menus zu spliten und anschließend die drei ersten, (Die Werte sind durch Komma getrennt) in drei unterschiedlichen anderen Dropdown-Menus zu schreiben.

Mit dem folgenden Code erhalte ich beim schreiben des ersten Wertes: "Undefinde".

Kann mir bitte Jemand hier den Tipp geben woran es legen könnte.

Vielen Dank und Gruß
Messmar

Code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>
<head>
	<title>Unbenannt</title>
	<script>
	<!--
		function splitOption() {
		
			this.xxxx = document.forms[0].grpattr_venue.options[document.forms[0].grpattr_venue.options.selectedIndex].value;
			alert(xxxx);
			this.moreValues = new Array();
			moreValues = xxxx.split(',');
			alert(moreValues[0]);
			
			alert(moreValues.length);
		
			//document.forms[0].venue.length = 0;
			for(var i=0; i<= moreValues.length; i++){
				optionen = new Option(moreValues[0][i]);
				alert(moreValues[0][i]);
				document.forms[0].venue.options[i] = optionen;
				document.forms[0].venue.options[i].value = moreValues[0][i];
			}
		}
	//-->
	</script>
</head>

<body>
<form>
<select name="grpattr_venue" style="width:386px;font-size:11px">
    <option value=""></option>
    <option value="Truro, Alverton Manor, 26 April 2006, 8.00am, Breakfast">Truro, Alverton Manor, 26 April 2006, 8.00am, Breakfast</option>
    <option value="Glasgow, Crowne Plaza, 27 April 2006, 8.00am, Breakfast">Glasgow, Crowne Plaza, 27 April 2006, 8.00am, Breakfast</option>
    <option value="Exeter, Woodbury Park, 28 April 2006, 8.00am, Breakfast">Exeter, Woodbury Park, 28 April 2006, 8.00am, Breakfast</option>
    <option value="Belfast, Culloden Hotel, 28 April 2006, 12.00pm, Lunch">Belfast, Culloden Hotel, 28 April 2006, 12.00pm, Lunch</option>
    <option value=""></option>

<br><br><br>
<a href="javascript:splitOption();">test</a>
<br><br><br>

<select name="venue" id="neuesAutoMarke">
	<option value="">bitte w&auml;hlen</option>
</select>

<select name="location" id="neuesAutoMarke">
	<option value="">bitte w&auml;hlen</option>
</select>


<select name="date" id="neuesAutoMarke">
	<option value="">bitte w&auml;hlen</option>
</select>
</form>
</body>
</html>

Sven Mintel · 15. Juni 2006

Code:

optionen = new Option(moreValues[0][i]);

..du bewegst dich da in einer Dimension des Arrays, die nicht existiert...machs lieber so:

Code:

optionen = new Option(moreValues[i]);

messmar · 15. Juni 2006

Danke schon mal.

Ich habe es gelöst und zwar folgendermaßen:
Es mag sein, dass der Code evtl. nicht ganz elegant ist, aber es funktioniert schon ein mal. Aber falls du verbesserungsvorschläge (Was dieser Code hier angeht) hast, würde ich mich freuen.

Gruß
Messmar

Code:

<script>
	<!--
		function splitOption() {
		
			this.xxxx = document.forms[0].grpattr_venue.options[document.forms[0].grpattr_venue.options.selectedIndex].value;
			alert(xxxx);
			this.moreValues = new Array();
			moreValues = xxxx.split(',');
			alert(moreValues[0] + '\n' + moreValues[1] + '\n' + moreValues[2] );
			venueEntries = new Option(moreValues[0], moreValues[0], false, true);
  			document.forms[0].venue.options[document.forms[0].venue.length] = venueEntries;
			
			locationEntries = new Option(moreValues[1], moreValues[1], false, true);
  			document.forms[0].location.options[document.forms[0].location.length] = locationEntries;
			
			dateEntries = new Option(moreValues[2], moreValues[2], false, true);
  			document.forms[0].date.options[document.forms[0].date.length] = dateEntries;
			
			for (i = 0; i < document.forms[0].venue.length && i < document.forms[0].location.length && i < document.forms[0].date.length; i++){
			    if (document.forms[0].venue.options[i].defaultSelected == true 
					&& document.forms[0].location.options[i].defaultSelected == true
					&& document.forms[0].date.options[i].defaultSelected == true
					)
					{
				        document.forms[0].venue.options[i].selected = true;
					    document.forms[0].location.options[i].selected = true;
					    document.forms[0].date.options[i].selected = true;
				}
			}
		}
	//-->
	</script>

Quaese · 15. Juni 2006

Hi,

vielleicht kannst Du es allgemeiner lösen. Erstelle ein Array (arrSelect), welches die Namen der Select-Felder
in der Reihenfolge enthält, in dem die Informationen im String enthalten sind, der gesplittet wird. Steht die
Information zur Stadt z.B. an erster Stelle, erfolgt der Eintrag des Namens im Array ebenfalls an erster Stelle.

Code:

function splitOption() {
  // Array für Ausgabeelemente (muss Reihenfolge des String besitzten, der gesplittet wird)
  var arrSelect = new Array("venue", "location", "date");

  this.xxxx = document.forms[0].grpattr_venue.options[document.forms[0].grpattr_venue.options.selectedIndex].value;
  this.moreValues = xxxx.split(',');

  // Ausgabeelemente durchlaufen
  for(var i=0; i<arrSelect.length; i++){
    // Neue Option erstellen
    objEntry = new Option(moreValues[i], moreValues[i], false, true);
    // Option an aktuelles Ausgabeelement anhängen
    document.forms[0].elements[arrSelect[i]].options[document.forms[0].elements[arrSelect[i]].length] = objEntry;
  }
}

Durch den vierten Parameter beim Erstellen einer neuen Option wird angegeben, ob das neue Element
selektiert sein soll. Da dieser Parameter bei Dir den Wert true besitzt, ist die neue Option gewählt
und die Prüfung zum Selektieren kann entfallen.

Vielleicht hilft Dir das weiter.

Ciao
Quaese

✔ Split und dynamische Option-Felder

messmar

Erfahrenes Mitglied

Sven Mintel

Mitglied

messmar

Erfahrenes Mitglied

Quaese

Moderator

Neue Beiträge