Jednoduchý Drag and Swap child elementů v JS – JavaScript, AJAX, jQuery – Fórum – Programujte.com

Ahojte,

V Javascriptu jsem začátečník a potřeboval bych vyřešit „na rychlo“ jedno zadání. Pro zkušené to nebude nic složitého. :-)

Momentálně jsem si vytvořil toto zadání: https://jsfiddle.net/vafu80hk/

V každém sloupci je 5 boxů. Každý box obsahuje 6 divů s textem.

Každý box je draggable. Když uživatel chytí jeden box (div DND_OneElement) a přesune ho na druhý, je třeba prohodit obsah (text) pouze těchto divů:

• DND_OneElement_UpperLeftText
• DND_OneElement_MiddleLeftText
• DND_OneElement_DownLeftText

Příklad:

Na startu: http://i.imgur.com/bUS6eMR.png

Uživatel chytí myší box, kde je „Element 002“ a natáhne ho na box „Element 008“:  http://i.imgur.com/xNC1fCu.png

Výsledek po dropu bude vypadat takto: http://i.imgur.com/p7zbf5x.png

Dokáže mi někdo dopsat JS? Děkuji všem za pomoc předem. :-)