0

I am using dragtable plugin for reorder columns in my web application. It works well for static tables which gets loads with the page. But it is not getting applied to the table as table is generating dynamically on page. Could anyone help me initiating it after dynamic table loads on the page.

Dragable plugin link: http://www.danvk.org/wp/dragtable/

jsfiddle link: http://jsfiddle.net/kslagdive/LfKvN/

Please suggest

3 Answers 3

1

You simply call the dragtable method makeDraggable:

$().ready(function() {
    var table = $('<table id=table class="draggable" cellpadding=2 border="1" style="background:#f3f3f3" ><tr><th>test</th><th>test</th><th>test</th></tr><tr><td>1</td><td>2</td><td>3</td></tr></table>').appendTo('body');
    // the object has to be a HTML DOM Object, not a jQuery object, so I use
    // table[0] to receive it
    dragtable.makeDraggable(table[0]);
});

Demo is here.

0
0

You could just reinitialize the plugin after it has been dynamically added to the page. I'm guessing in the $(document).ready of your page you are doing something like this:

$(document).ready(function() {
    $('#yourTable').draggable();
});

Just call .draggable on the table again.

0
0

If you are using twitter-bootstrapTable you can add this to your onLoadSuccess function

onLoadSuccess: function() {
     $table.on('all.bs.table', function (event) {
         $('#table-javascript').dragtable('destroy').dragtable({});
     });
}

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.