Einträge kopieren zwischen Optionlisten
Ein Skript mit dem man Einträge zwischen zwei Optionlisten mit Javascript kopieren kann.
Quelltext
function moveTo(form, from, to, del) { if(!form || !form.elements) return alert('Kein Formular'); var source = form.elements[from]; var target = form.elements[to]; if(!source) return alert(from + ' existiert nicht im Formular!'); var idx = source.selectedIndex; if(target) { for(var i = 0; i < source.length; i++) { var s = source.options[i]; if(s.selected) target[target.length] = new Option( s.text, s.value); } } // eintr?ge l?schen if(!target || del) { var i = source.length while(i--) if( source.options[i].selected) source.options[i] = null; } source.selectedIndex = idx; } |
Beschreibung
moveTo()
Die Funktion moveTo()
erwartet bis zu vier Parameter:
moveTo(Form, Quelle, Ziel, löschen)
- Form (Object)
Ist eine Referenz auf ein Formularobjekt. Wenn der Aufruf der Funktion durch ein Formularelement erfolgt, dass im gleichen Formular ist wie die Listen, dann eignet sich am besten
this.form
für diesen Parameter.
Ansonsten muss dortdocument.forms['nameDesFormulars']
eingetragen werden. - Quelle (String)
Der Name der Liste aus dem die Einträge verschoben werden sollen.
- Ziel (String)
Der Name der Liste in die die Einträge verschoben werden.
- löschen (true/false)
Dieser Parameter bestimmt, ob ein verschobener Eintrag aus der Quellliste gelöscht wird.
Der HTML Code für das Beipiel, sieht folgendermaßen aus:
<form name="testform" onsubmit="return false;"> <select name="liste1" size="15" style="width:15em" multiple> <option>------------------------------------</option> .... </select> <input type="button" value=">>" name="right" onclick="moveTo(this.form, 'liste1', 'liste2', true);"> <input type="button" value="<<" name="left" onclick="moveTo(this.form, 'liste2', 'liste1', true);"> <select name="liste2" size="15" style="width:15em"></select> </form> |
(bereinigt von den Tabellen)
ähnliche Artikel
- 1. Februar 2006 -- Wie kann man alle Einträge aller Selectfelder wählen? (0)
Folgende Funktion selektiert alle Eintr�ge, in allen...
- 28. November 2024 -- Animierte Tabellen Sortierung (10)
Aufgrund einer Frage bei meinem alten Tabellensortierer-Skript...
- 6. August 2019 -- CAS Nummer validieren (0)
Wieder ein kleines Skript aus dem Bereich Chemie. Um...
43792 mal gelesen.
11 Kommentare
direkt zum Formular »
Seiten:
6. April 2006: 14:44
SPITZE! genau das hatte ich gesucht. meine „konstrukte“ haben zwar mehr oder weniger funktioniert – aber „spaß“ ist war anderes ;)
tausend dank für diese einfache aber geniale lösung!
31. August 2006: 17:53
Super genau das richige, habe lange danach gesucht.
1. März 2007: 13:21
Hallo,
wie kann ich dann die Einträge aus Liste2 weiterverarbeiten?
Ich habe versucht, dass Formular abzuschicken und mit PHP auszulesen, aber es kommen keine Daten mit.
1. März 2007: 13:26
Du musst vor dem abschicken (also onsubmit) die Einträge per JS alle selektieren
1. März 2007: 14:17
Ich habe in das gleich mit beim Kopieren gemacht.
alt:
if(s.selected) target[target.length] = new Option( s.text, s.value);
neu:
if(s.selected) target[target.length] = new Option( s.text, s.value, s.selected);
1. März 2007: 14:31
Stimmt, gute Idee.
4. November 2007: 21:08
Hallo,
ich bekomme es partout nicht hin, daß die Werte übernommen werden, auch nicht mit der Idee von Thomas Heinze. Kann mir jemand weiterhelfen ?
Danke!
Phoenix
nospam at musicalzirkel dot de
6. November 2007: 13:23
sollte aber.
14. November 2007: 14:53
Danke für den Code.
Beim probieren habe ich aber festgestellt, dass der FF 2.0.0.9 beim verschieben von rechts nach links eine Exception wirft:
uncaught exception: [Exception… „Component returned failure code: 0x80004005 (NS_ERROR_FAILURE) [nsIDOMHTMLSelectElement.selectedIndex]“ nsresult: „0x80004005 (NS_ERROR_FAILURE)“ location: „JS frame :: http://javascript.jstruebig.de/javascript/38/ :: moveTo :: line 233″ data: no]
Den Fehler verursacht die Zeile mit der folgenden Anweisung:
source.selectedIndex = idx;
Kann man das beheben/umgehen?
26. September 2008: 11:12
[…] AW: Daten zwischen Auswahlfeldern verschieben – Heute, 11:12 [Javascript ist Toll!] > Einträge kopieren zwischen Optionlisten […]
7. März 2019: 12:58
Super genau das richige, habe lange danach gesucht.