jqueryjquery-uidrag-and-dropdraggablelivequery

jQuery Drag And Drop Using Live Events


I have an application with a long list that changes frequently, and I need the items of that list to be draggable.

I've been using the jQuery UI draggable plugin, but it is slow to add to 400+ list items, and has to be re-added every time new list items are added.

Does anyone know of a plugin similar to the jQuery UI draggable plugin that uses jQuery 1.3's .live() events? This would solve both problems.


Solution

  • Wojtek's solution worked perfectly for me. I wound up changing it a tad bit to make it extend jQuery...

    (function ($) {
       $.fn.liveDraggable = function (opts) {
          this.live("mouseover", function() {
             if (!$(this).data("init")) {
                $(this).data("init", true).draggable(opts);
             }
          });
          return this;
       };
    }(jQuery));
    

    Now instead of calling it like:

    $(selector).draggable({opts});
    

    ...just use:

    $(selector).liveDraggable({opts})