4

I'm trying to get jqueryui drag and drop to work with emberjs. I have a fiddle set up here: http://jsfiddle.net/XMgwV/13/ but I cant seem to get the drop event to fire. The mixin is from this demo: http://www.lukemelia.com/blog/archives/2012/03/10/using-ember-js-with-jquery-ui/

Edit:
If I change the jQueryUI draggable helper function to 'original' it works as expected. It seems to be a problem with jquery ui .clone() and ember, as pointed out in #7 here. The safeClone method in the codebrief blog post does not seem to solve the problem fully..

Anyone knows how to get this to work as expected?

oskbor
  • 1,592
  • 18
  • 35

2 Answers2

2

I've had to fix the jQuery UI wrapper to make it work. But all I could come up with was a dirty hack.

I had to turn

var ui = jQuery.ui[this.get('uiType')](options, this.get('element'));

into

var ui = $(this.get('element'))[this.get('uiType')]();

http://jsfiddle.net/MSch/LrHTB/1/

Martin S.
  • 556
  • 4
  • 11
1

It looks like your example will work if you add:

    clone.removeClass('ember-view');

to the safeClone helper.

Here's a jsfiddle that should solve the problem: http://jsfiddle.net/Wu2cu/

Jack Johnson
  • 704
  • 1
  • 6
  • 14
  • great find! hopefully it doesnt break anything :) I doubt it will – oskbor May 07 '12 at 15:56
  • I'll be implementing it in a project the next few days, will let you know if any issues arise – Jack Johnson May 07 '12 at 18:47
  • 1
    Do you know why the drop event fires twice? Havent figured that out yet. Im getting that behavior in both Chrome and Safari – oskbor May 10 '12 at 19:27
  • 1
    henk pointed out to me that the jquery event fires once and the dom event once. He even made a fiddle demonstrating it: http://jsfiddle.net/Wu2cu/2/ – oskbor May 12 '12 at 15:09