✔ jQuery: Elemente aus einer Liste auf gewisse Positionen schieben

[ReoZeel]

Hallo,

etwas schwer zu beschreiben, aber ich versuche es.
Ich möchte dem User eine Liste von Elementen anbieten.

Beispiel:
1. Element
2. Element
3. Element

Ich möchte, dass die Leute diese Elemente nehmen und per Drag&Drop auf eine Liste schieben. Also eine Art Reihenfolge festlegen.

Beispiel:
Position 1
Position 2
Position 3


Dabei sind folgende Sachen für mich wichtig.
1. Die Elemente selbst sollen zwar verschiebbar sein, aber nur als Kopie. Das Original soll da bleiben so es ist.
(Der User soll also beim Ziehen eine Kopie des Elements bekommen)
2. Die Elemente sollen genau auf 3 Positionen verschiebbar sein und dort "einklinken". Sollte der Benutzer das Elemente an eine andere Stelle ziehen so soll die Kopie (siehe 1) einfach verschwinden und nicht irgendwo auf der Webseite "liegen bleiben".
3. Es soll durchaus möglich sein, dass man 1 Element mehrfach verschiebt und an mehreren Positionen einordnet. In dieser Richtung muss ich also keine weiteren Abfragen etc. einbauen.
4. Wenn die Auswahl des Benutzers steht soll diese Liste dann (z.B. per sortable) nochmal sortierbar gemacht werden.

Meine Fragen:
Ist dies überhaupt möglich mit dem "Standard jQuery (UI)"?
Wenn ja: Wie setze ich das um? Ich brauche jetzt von euch keinen Quelltext oder so. Einfach ein paar Tipps und Hinweise, ich baue mir das dann zusammen.
Mein ersten Problem ist schon das Verschieben. dragable() ist zwar schön, aber das Element selbst soll ja an der Position bleiben und nicht direkt, sondern als Kopie verschoben werden.
Wie mache ich das mit dem Einrasten? Meine erste Idee ist droppable. Doch wie hinbekommen, dass die Kopie "verwindet", wenn sie irgendwo hin abgelegt wird?

Evtl. ist das alles recht viel, aber ich hoffe, dass ihr mir helfen könnt. Ich bin noch ganz neu in jQuery und das soll so ne Art Einstieg werden.


Danke und Gruß,
Reo

 

[ReoZeel]

Ich habe die meisten Probleme inzwischen lösen können und auch in einem anderen Thread, der einen Teil der Frage speziell enthielt, zu einer brauchbaren Lösung gekommen.
Daher ist ein Antworten eurerseits nicht mehr nötig.
Sollten noch Fragen aufkommen werde ich diese gezielter in einem neuen Thread stellen.

 

[tobee]

Ist dies überhaupt möglich mit dem "Standard jQuery (UI)"?

Nach kurzem überfliegen: Ja

dragable() ist zwar schön, aber das Element selbst soll ja an der Position bleiben und nicht direkt,
sondern als Kopie verschoben werden.

$( ".selector" ).draggable({ helper: 'clone' });

http://docs.jquery.com/UI/Draggable#option-helper

Wie mache ich das mit dem Einrasten? Meine erste Idee ist droppable.
Doch wie hinbekommen, dass die Kopie "verwindet", wenn sie irgendwo hin abgelegt wird?

$( ".selector" ).draggable({ revert: true });

http://docs.jquery.com/UI/Draggable#option-revert

Danke und Gruß,
Reo