Click event when dragging an item (Firefox)

Question

When I click on an item, I can edit the field thanks to bootstrap-editable .
When I drag an element, I can reposition the element thanks to jquery.ui.sortable .

Using Google Chrome all works great.
Using Firefox 15.0.1 , I have the following problem.

After moving the item, a pop-up window appears for editing the field.
I assume that this event is related to the distribution of the event.
I tried to fix it, but without success ...

Here is my part code:

  onSortReceive: function (e, ui) { this.$(ui.item[0]).trigger('drop', this.options.taskType); // TODO just on firefox there is a issue related to bootstrap-editable // it shows the popup even if there is e.stopPropagation() here // the only way to fix this issue is to re-render the view e.stopPropagation(); // it makes no difference this.render(); // it fix the problem // but I want to avoid to re-render the view }, 

For the full code, you can continue:
https://github.com/antonioJs/CoCoTask/pull/21/files

For the working version, you can continue:
http://computerone.altervista.org/CoCoTask/ (problem only with firefox)

Any idea how to fix the problem?

thanks

Answer 1

Ok, here is one work path I found. In taskItem.js replace onRender following code:

  onRender: function () { var sortInAction = false; this.$el.find('label').mouseup(function(e) { sortInAction = 'absolute' === $(e.target).closest('li').css('position'); }).click(function(e) { if (sortInAction) e.stopImmediatePropagation(); }).editable({ type: 'textarea', name: 'task-name', validate: this.editTaskName, template: '<textarea rows="3"></textarea>' }); }, 

Hope this helps.

Answer 2

You should execute the e.preventDefault () mouseup , not the sortreceive jquery.ui . Perhaps something like this will work (not verified):

 'mouseup li': 'liMouseUp' /* ... */ liMouseUp: function(e) { if ($(e.target).is('.ui-draggable-dragging')) { e.preventDefault(); } }