jQuery Table Drag’n Drop Plugin

jQuery Table Drag and Drop plugin simply adds drag’n drop functionality to tables.

Table drag’n dropping can’t be handled by standard drag’n dropping utilities as you need to move the whole row, not just the cell that receives the mouse events and re-parenting the row also requires specific code.

jQuery Table Drap Drop

This drag and drop plugin:

  • Allows the user to reorder rows within a table.
  • Individual rows can be marked as non-draggable and/or non-droppable.
  • Rows can have as many cells as necessary and the cells can contain form elements.

Standard usage is very simple:

$("#table-1").tableDnD();

After every drag’n drop event the new ordering values of the columns are returned as an array which you can send it as an Ajax query for updating the database.

  • http://www.codervods.com Jeff Justice

    Thanks for telling us about the plugiin… It’s going to be very useful for me.

  • http://www.101poundwebsite.com Matthew ‘Web Design’ Adams

    ~Cool plug-in. Nice one!

  • http://www.hospedavip.com Daniel Schultz

    Right now, I am using this plugin to make a bus ticket system, so passengers can choose seats and drag them to an text input. Quite cool.

    Thanks

  • http://www.moowebsolutions.co.za Constant Meiring

    Using this for the reordering of images on a CMS.

    Thanks!

  • http://www.bestonlinescripts.com Hery

    Good stuff. For now on, I will use this plugin for my dinamyc database table.

  • Seppo Hovi

    The (X)HTML-standard indicates that the ID-attribute cannot start with a number which seems to be the key requirement for this plugin to work. Please tell me I’m wrong?

  • http://www.webresourcesdepot.com Umut M.

    @Seppo,

    You’re right. But a simple modification in id names & how they are handled can fix it.

  • http://power.me Dan Noorlander

    If you start the plugin through a function (there’s a reason for not wanting drag n drop on all the time), is there a ay to turn it off once it is called?

  • bird

    so cool

Search