Search code examples
javascriptjqueryhtml-tabletablednd

Table drag and drop (holding only one column)


I wanted to do draggable table rows, I found TableDnD jQuery plugin and it works fine

$(function() {
   $("table").tableDnD(); 
});

As you can see there: http://jsfiddle.net/drBfS/1/.

But I wanted to make only one column draggable. I mean, whole row (tr) is moved like now, but you can move row only by dragging left column (td.drag), when trying to drag right column it should be no effect. Have you got any idea how it can be done?


Solution

  • It appears that this is an older plugin, where it might have been possible to do this at one point, according to this document: http://isocra.com/2008/02/table-drag-and-drop-jquery-plugin/

    However, after looking through the source now, it is no longer possible. Instead, perhaps consider simply using jQuery UI sortable. If you wrap your rows in a tbody, this code will get you what you want:

    jQuery(function () {
        jQuery('table tbody').sortable({ handle:'.drag' });
    });