Home/ Questions/Q 6659521
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-26T02:02:40+00:00

I have an arrangement of elements on a page: <div> <div class=dragdrop style=top:0px; left:

  • 0

I have an arrangement of elements on a page:

<div>
  <div class="dragdrop" style="top:0px;  left: 0px;  ">1</div>
  <div class="dragdrop" style="top:40px; left: 0px;  ">2</div>
  <div class="dragdrop" style="top:60px; left: 0px;  ">3</div>
  <div class="dragdrop" style="top:0px;  left: 100px;">4</div>
  <div class="dragdrop" style="top:40px; left: 100px;">5</div>
  <div class="dragdrop" style="top:60px; left: 100px;">6</div>
</div>

How can I use jQuery UI (Draggable / Droppable) to make it so that if one div is dropped onto another, they swap positions? (And if it’s dragged anywhere else, it reverts back to its old position.)

Thanks.

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    Here is an example of how you can swap elements with drag and drop http://jsfiddle.net/76yRN/1/

    Another question about swapping elements in jquery jQuery draggable items lose their draggability after being swapped (with jsfiddle example)

    Hope this helps

    • 0