JavaScript Select Inhalte in Textfeld kopieren

Sparta8 · 11. Juni 2012

Hallo,

folgende Situation: Ich hab ein Selectfeld in dem mehrere Namen eingetragen sind. Bei onselect wird ein JavaScript ausgelöst welcher den selektierten Inhalt in ein Textfeld kopiert und falls bereits Inhalt vorhanden ist, diese mit einem Beistrich trennt.

HTML:

<select onchange="document.sendeform.to_name.value=(document.sendeform.to_name.value.length>0 && document.sendeform.userlist.value.length>0) ? document.sendeform.to_name.value+','+document.sendeform.userlist.value : document.sendeform.userlist.value; return false;" name="userlist" class="inputbox" size="1">
<option value="">&nbsp;</option>
<option value="Max Mustermann">Max Mustermann</option>
<option value="Silke Maier">Silke Maier</option>
</select>

Ich würde nun gerne ein Button einfügen welcher jeden einzellnen Punkt in das Textfeld kopiert und mit einem Beistrich trennt.

Irgendwer eine Idee wie ich das am besten angehen müsste? Hab leider nicht so viel Ahnung von der Materie. Wäre für jeden Tipp dankbar!

Madman1209 · 11. Juni 2012

Hi,

was meinst du mit "jeden einzelnen Punkt"? Was soll am Ende im Textfeld stehen?

Max Mustermann - Silke Maier

Wäre das so wie du es dir vorstellst?

VG,
Mad

Yuuri · 11. Juni 2012

Code:

for( var i in <select>.children )
  <textarea>.innerHTML += '-' + <select>.children[i].value;

select und textarea bei dir noch ersetzen, das am besten in eine Funktion packen und beim Klick vom Button aufrufen.

Sparta8 · 11. Juni 2012

Soz falls ich mich schlecht ausgedrückt hab. Zurzeit ist es so:
Wenn ich in der SelectBox einen Namen auswähle steht im Textfeld: "Max Mustermann". Wenn ich wieder einen Name auswähle steht dort "Max Mustermann, Silke Maier". usw.

Ich würde nun gerne einen Button erstellen der alle Optionen aus dem Selectfeld ausliest und diese dann einträgt. Also nach Knopfdruck würde im Textfeld dann stehen: "Max Mustermann, Silke Maier, Susi Huber, usw., usw."

Ergänzung (11. Juni 2012)

Hallo und vielen vielen Dank für deine Hilfe!
Ich habe mit deiner Unterstützung folgendes Script geschrieben:

Code:

function copyAllUsers() {
		var inputTextGesamt;
		var hilfsVariable;
		for( var i in document.sendeform.userlist.children )
    inputTextGesamt += ',' + document.sendeform.userlist.children[i].value;	
		hilfsVariable = inputTextGesamt.length;
		inputTextGesamt = inputTextGesamt.slice(2, hilfsVariable);
		document.sendeform.to_name.value = inputTextGesamt;
		}

Der Slice Befehl ist deshalb drinnen, weil in der Select Box der erste Eintrag immer leer ist und mein Script sonst folgenden String erzeugen würde ",,Max Mustermann,Silke Maier". Mit dem Slice lösche ich die ersten 2 Beistriche weg.

Alles klappt wunderbar bis auf ein letztes Problem. Am Ende der Namensliste wird 3 mal ",undefined" angehängt. Sie schaut dann z.B. so aus: "Max Mustermann,Silke Maier,undefined,undefined,undefined"

Womit könnte diese Fehler zusammenhängen? Könnte auch hier mit dem Slice befehl arbeiten, und das Ende einfach wegschneiden, aber ich frage mich wie das überhaupt zustande kommt?

Danke nochmal für alles!!

Yuuri · 11. Juni 2012

Es kann u.U. sein (so wie bei dir jetzt), dass TextContent Nodes in der DOM enthalten sind. Dann müsstest du vorher abfragen ob typeof( select.value ) != undefined ist, wodurch du dies umgehen kannst und wenn nicht, du es zur Liste hinzufügst. Du könntest aber auch auf ein select.value == '' abfangen, dann musst du nicht mit slice arbeiten.

Sparta8 · 11. Juni 2012

Könntest du den Teil mit "TextContent Nodes in der DOM" ein wenig genauer ausführen?

Yuuri · 11. Juni 2012

Die DOM ist die Baumstruktur der Webseite (einfach mal mittels Entwickler Tools anzeigen lassen). Jedes einzelne Zeichen zwischen eigentlichen Knoten (<select>, <div>, ...) ist dabei ein TextContent Node, welches auch in der DOM auftaucht, mit welchem du aber nichts anfangen kannst (ja es nur Whitespaces sind). Deswegen prüfst du einfach ob value nicht leer ist und schon passt das.

Suche

JavaScript Select Inhalte in Textfeld kopieren

Sparta8

Lieutenant

Madman1209

Fleet Admiral

Yuuri

Fleet Admiral

Sparta8

Lieutenant

Yuuri

Fleet Admiral

Sparta8

Lieutenant

Yuuri

Fleet Admiral

Ähnliche Themen