#380 ✓invalid
Juho Vepsäläinen

Draggable fails to restore CSS after dragging

Reported by Juho Vepsäläinen | October 16th, 2010 @ 11:08 AM

I just noticed that Draggable plugin doesn't restore CSS of the element dragged to its previous state after dragging. This can be troublesome if your code happens to rely on some certain predefined styling (Draggable overrides this).

Comments and changes to this ticket

  • MadRabbit

    MadRabbit October 17th, 2010 @ 12:07 PM

    • State changed from “new” to “invalid”

    okay, I looked through the code and it seems like there is no way to make this thing working properly for all the cases,

    it does automatically restore the styles if you deal with clone-drag or a revert-drag, but when you deal with a normal drag, there is no way to tell what the developer actually need. See, you might drag an inline element, then Draggable will preserve its sizes so the element didn't blow off when it will be pulled out of its original context. But once the user finishes the drag it all depends on what the app logic is. Some one might want this thing just stay where it is, some might want to put the element into other context, some wan't it adjust to the new context, some might want it to keep the original shape.

    so I believe every case should be handled separately via callbacks

  • Juho Vepsäläinen

    Juho Vepsäläinen October 17th, 2010 @ 12:24 PM

    Thanks for the explanation. :)

    I tried hacking around the issue by stashing the old style at 'before' and then restoring it at 'stop'. The problem was that the CSS markup had been altered already at 'before' making this approach not work. Perhaps 'before' needs to be triggered before that or perhaps there needs to be an additional event ('init'?) to hook into.

  • MadRabbit

    MadRabbit October 17th, 2010 @ 03:31 PM

    Hmm, are you sure? I'm looking at the code and the 'before' event is fired before any changes

    afterwards you can run your stuff right after constructing a draggable.

    var draggable = new Draggbale('my-element');
    
    draggable.old_stuff = $('my-element').getStyle('...');
    draggable.onStop(function() {
      this.element....;
    });
    
  • Juho Vepsäläinen

    Juho Vepsäläinen October 17th, 2010 @ 04:27 PM

    Thanks. :)

    I ended up using direct DOM access to reset style to original. Here's my initial solution: http://gist.github.com/630800 .

    Since "style" attribute is empty by default I could probably get rid of that "draggable.oldStyle" part and just set style attribute as empty. I guess having it there doesn't hurt.

Please Sign in or create a free account to add a new ticket.

With your very own profile, you can contribute to projects, track your activity, watch tickets, receive and update tickets through your email and much more.

New-ticket Create new ticket

Create your profile

Help contribute to this project by taking a few moments to create your personal profile. Create your profile »

RightJS Core Tickets

Shared Ticket Bins

People watching this ticket

Tags

Pages