Multiple drag and drop tables do not work

A 1st pass of firebugging through dragtable.js showed this :
the function dragRow() (the mousemove event handler) starts by checking the existence of self.dragObject, wich seems to only exist when trying to drag from the last attached table.

Time to go to bed, I'll try dig more tomorrow.

The bug lies in these lines in tabledrag.js :

$(document).bind('mousemove', { tableDrag: self }, self.dragRow);
$(document).bind('mouseup', { tableDrag: self }, self.dropRow);

When executed with different values of self (different table), jquery considers that you're re-binding the same handler (dragRow) to the same object (document), and thus overrides the previous binding instead of adding a new one (dragRow function already has a guid - uncompressed jquery.js, line 1582)

Attached patch fixes this by having dragRow / dropRow take self as a param, and return a new handler function for every value of self :

$(document).bind('mousemove', self.dragRow(self));
(...)
Drupal.tableDrag.prototype.dropRow = function(self) {
  return function(event) {
    if (self.dragObject) { 
      (...)
    }
  }
}

It does work, but I'm absolutely not sure it's the cleanest/proper way to fix this. Reviews welcome (... Nate ? :-)

PS : I published the 'drag-n-drop field values' patch for CCK HEAD in http://drupal.org/node/195268 - I'm not committing it until we have a fix for this.
In order to test : grab CCK HEAD, apply the patch, add 2 or 3 multiple fields to a content type, and play with the node edit form.
Without the tabledrag fix, only the last table (or the last on which you hit the AHAH-'add new values' button) gets correct d-n-d.

As a side note, I guess fixing this might not only benefit CCK, but also maybe Views UI (seperately reorder filters, fields, sorts, etc) ? Not sure what is in the works about that...

Of course, much cleaner than my original patch. And works perfectly.

Attached patch updates the signature of the call to dropRow in the blur handler (was missing in my patch too)
Aside from that, I think this is ready, but I cannot RTBC this new patch.

Cool :-) Thanks Nate !

multiple values reordering is committed to CCK HEAD :-)

Ah, true. It was a nice catch, but an incomplete one...
This is straightforward. RTBC.

Actually this seems to have broken tabledrag in IE7.
When you click a dnd handler, the moment your pointer leaves the handler area, dragRow() (mousemove handler) is not called anymore, until you unclick, which does not trigger dropRow() (mouseup handler) but lets dragRow() be called again

Reopening, and leaving the 'critical' priority on.

Right, sorry about the title.

So. This doesn't make any sense.

If I simply comment out these lines from current HEAD tabledrag.js :

Drupal.tableDrag.prototype.row = function(tableRow, method, indentEnabled, maxDepth, addClasses) {
  this.element = tableRow;
  this.method = method;
//  this.group = new Array(tableRow);
  this.groupDepth = $('.indentation', tableRow).size();
  this.changed = false;
//  this.table = $(tableRow).parents('table:first').get(0);
  this.indentEnabled = indentEnabled;
  this.maxDepth = maxDepth;
  this.direction = ''; // Direction the row is being moved.
  (..)

this of course breaks the functionality *but* the event handlers are called the way they're supposed to.
Uncommenting either one of these lines makes event handlers break again.
Appending an _ after the variable names (this.group_, this.table_), makes the thing work again...

Beats me for now...

Side note : everything works fine in IE6.

OK, I'm not sure exactly what is happening, but after a couple hours trying to follow the evenements flow, I tried preventing the mousedown event from bubbling up, and this fixed it.

Of course it's only afterwards that I that I noticed the 'return false' at the end of dragRow() which was there precisely to this intent, but wasn't effective anymore after the patch in #5 above got committed...

Tested to work in FF2, IE7, IE6, Opera...