jquery.event.drag and jquery resizable incompatibility

Question

I've both slickgrid and jquery-ui libraries and is causing some problems. Without jquery.event.drag library (needed by slickgrid) it was working nicely.

I have a resizable and draggable div and I am using THREEDUBMEDIA's jquery.event.drag plugin.

When I try to resize the div it's doing drag&drop and resize too.

Did somebody had some trouble combining both libraries, can it be fixed?

fiddler example : fiddler

Answer 1

The solution I found is to use older version of the jquery.event.drag libray.

I am now using:

• jquery.event.drag 1.5
• jquery 1.7.2
• jquery-ui 1.10.3
• SlickGrid 2.1

and it's working fine.

Answer 2

The real solution is to get jquery.event.drag and jquery-ui to resolve their incompatibility.

SlickGrid uses/requires jquery.event.drag, and there's good reason for it. It's dependency on jQuery UI is purely optional. jquery.event.drag is small, efficient, and is a much better fit for the functionality that I needed for SlickGrid. Switching to jQuery UI's drag/drop is out of the question, and implementing it directly is a step backwards.

Answer 3

Since you are using jQuery UI, why are you using another plugin for drag and drop features?

You can use and mix jQuery UI:

• drag & drop
• resizable

Forked demo: http://jsfiddle.net/IrvinDominin/5kn5S/

Answer 4

I ran today into the same issue. The answer must be to fix slickgrid. I.e. making it configurable, which plugin to use:

jquery.event.drag OR jquery-UI -- not both.

I opened this issue: https://github.com/mleibman/SlickGrid/issues/811

-- Sebastian