Tabellenzellen verschieben

killerbees19

Grünschnabel
Hallo.

Zuerst einmal kurz die Beschreibung der Seite:
Es handelt sich um eine Tabelle mit Verzeichnissen und Dateien, diese Dateien kann man alle markieren, was mit Javascript bereits sehr vereinfacht wurde.

Nun das Problem:
Wie schaffe ich es, dass ich eine Zeile in einer andere Tabellenzelle verschiebe? Ich will also eine schnelle Drag & Drop Möglichkeit zum Koepieren / Verschieben von Dateien anbieten. Ähnliche Möglichkeiten gibt es z.B. bei Scripten wie Roundcube Webmail. Das Senden und Empfangen der nötigen Daten mit Ajax ist bereits fertig und kein Problem, aber ich weiß nicht, wie ich 1) die Eventhandler richtig setze, damit bei gedrückter Maustaste (und einer Bewegung) alles startet und 2) wie ich erkennen kann, über welcher Tabellenzeile die Maus wieder los gelassen wurde. Zusätzlich müssen diese Eventhandler natürlich auch wieder entfernt werden, wenn die Maustatse z.B. außerhalb der Tabelle losgelassen wurde.

Ich habe zwar schon mit dem Verschieben von DIV Containern einmal herumprobiert, aber hier stehe ich entweder auf der Leitung oder ich verstehe es wirklich nicht. Kennt jemand von euch vielleicht schon fertige Scripte oder hat gute Erklärungen für mich parat?

Ich danke euch schon im Voraus für eure Hilfe.


MfG Christian
 
Danke für die schnelle Antwort einmal.
Etwas ähnliches habe ich auch auf genau dieser Seite eigentlich gefunden, jedoch sind diese Scripte alle so umfangreich, dass ich gehofft habe, ich finde eine simple Erklärung oder ein Beispiel. Denn sonst wird das Einbauen des Code's zu einer Lebensaufgabe.

Außerdem kann ich auf die Tabellen derzeit leider nicht verzichten. Genau dieses Script könnte ich auch sowieso nicht verwenden, da ich ja nichts wirklich optisch verschieben will, sondern nur erkennen will, worüber (also über welchem TR) die Maus wieder losgelassen wurde. Also eben wirklich nur so ala Webmail, wo man Mails per Ajax in andere Ordner verschieben kann.


MfG Christian
 
Von "nicht wirklich optisch" war aber eingangs nicht die Rede.
Also Du könntest den TD's, die du verschieben können willst, ein onmousedown-Event vergeben. Zusätzlich musst du im Document ein onmouseup-Event definieren. Über das onmouseup-Event könntest du in Erfahrung bringen, über welchem Element die Maustaste losgelassen wurde.

Benutzt Du ein JS-Framework?

DND ohne optische anzeige ist aber nicht wirklich DND ;)
 
Ich habe mich vielleicht ein wenig schlecht ausgdrückt :D
Anzeigen will ich es maximal so als Tooltip, neben dem Mauszeiger, also so wenig aufwändig wie möglich. Die Anfrage wird dann an den Server gesendet -> Ladesymbol -> und danach wird die Seite einfach neu geladen, wenn alles erfolgreich war. Ist im Moment einfach das einfachste, anstatt da alle Details der Dateien / Ordner mit JS zu aktualisieren.

Ich werd' mal ein wenig herumtesten damit.


MfG Christian

UPDATE:
Ich habe es jetzt einmal geschafft mit DIV's genau das gewünschte zu erkennen: http://www.happytec.at/pastebin/view...903fcedf30e4a1
Der Code ist nur für Testzwecke, deshalb so unschön

Das einzige Problem, dass ich jedoch nicht los werde ist: Ich markiere beim Verschieben ja eigentlich immer den gesamten text rundherum. Ich habe bereits probiert, ein DIV mit einem höheren Layer einfach über die ganze Seite zu legen, dann wird der Text zwar nicht mehr markiert, aber Javascript erkennt dann auch nicht mehr, wo ich die Maus los gelassen haben, egal ob ich den "Boxen" auch einen höheren Z-Index gebe...

Hast du dazu noch eine Idee, wie ich das lösen kann?
Ansonsten klappt es eigentlich wunderbar


MfG Christian
 

Neue Beiträge

Zurück