If a row is being dragged at the moment on another table, the currentTable variable will be overwritten and we get problems. In that case, here’s an external javascript function for serialization, which of course may be changed for other serialization formats

function serializeTableOrdering(table) {
  if (table) {
    var result = "";
    var tableId = table.id;
    var rows = table.rows;
    for (var i=0; i 0) result += "&";
        result += tableId + '[]=' + rows[i].id;
    }
    return result;
  }
  return "";
}

cheers

This is truely awesome work! I’m quite new ot this, but is it possible to handle this as a questionnaire and have the results ’sorting’ send to a db for evaluation?

Thanks in advance!

Here is the link to the code, the highlighted bits are the changes.

http://pastebin.com/f4e702774

    build: function(options) {
        // Make sure options exists
        options = options || {};
        // Set up the defaults if any

        this.each(function() {
            // Remember the options
            this.tableDnDConfig = {
                dragHandle: options.dragHandle ? options.dragHandle : "td", ///// added this
                onDragStyle: options.onDragStyle,
                onDropStyle: options.onDropStyle,

...

    makeDraggable: function(table) {
        // Now initialise the rows
        var rows = table.rows; //getElementsByTagName("tr")
        var config = table.tableDnDConfig;
        for (var i=0; i<rows.length; i++) {
            // To make non-draggable rows, add the nodrag class (eg for Category and Header rows)
			// inspired by John Tarr and Famic
            var nodrag = $(rows[i]).hasClass("nodrag");
            if (! nodrag) { //There is no NoDnD attribute on rows I want to drag
                jQuery(rows[i]).mousedown(function(ev) {
                    if (jQuery(ev.target).is(config.dragHandle)) { ///// changed this
                        jQuery.tableDnD.dragObject = this;
                        jQuery.tableDnD.currentTable = table;

...

That way the existing functionality will be the same, unless you specify a dragHandle selector.

I must admit I hadn’t anticipated people wanting to call serialize from outside the onDrop, but I think you can achieve the same thing with the following lines:

	jQuery.tableDnD.currentTable = document.getElementById("table-3"); // use your table ID obviously
	alert(jQuery.tableDnD.serialize());

Try it now

Basically all you need to do is ensure that currentTable is initialized to the right document element and then serialize() works as required.

In the next version I’ll wrap this up more neatly.

after I add a new element to table-1 I am able to delete and sort rows. I want to be able to call serialize without starting the drag and drop. ie. add form field (6) delete form field (2). submit form -fire serialize function.

I just can’t figure out how to access the serialize function even if the tr elements did not change position (were not dragged)

any suggestions??

great work on this plugin

@Sara - you could populate just one hidden field with the jquery serialised list after every drop and then access that field after posting the form. Alternatively (and i find this easier to work with), if you only need to know the new arrangement of id’s you could try adding the unique id to each row via a hidden form field, for example:

First Row Content
Second Row Content

Where each value is the database id. After you submit the form, the rearranged id’s in their new order should be available as an array $_POST[’row_id’]; Hope that made sense…