Drag & Drop using jQuery-ui

Question

Hi,

I am currently working on a project where I have to create a custom calendar sort of application to display and manage appointments easily.

I need to be able to drag and reschedule appointments appropriately. jQuery-ui is pretty neat and I am able to achieve almost everything except that I require that no appointments (divs) may overlap. I am not able to figure out how to achieve this. If someone could guide me into the right direction for this, it would be great.

Thanking you in advance for your time and patience.

Answer 1

This jQuery plug-in seems to handle collisions during drags: Collidable Draggables.

Alternatively, you could check for collisions when the drag ends, and cancel the drag. To give you an idea, someone has done this for resizing here.