Home/ Questions/Q 8450913
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-10T11:06:03+00:00

I want to drag and drop a table row randomly in a HTML table

  • 0

I want to drag and drop a table row randomly in a HTML table using jQuery (not using jQuery plugins).

Do you have any suggestions?

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    Simplest first.
    Do you consider jquery ui as a plugin ?

    If no, then you should look for it’s sortable method
    http://jqueryui.com/demos/sortable/
    They also have a droppable and draggable method.

    With sortable, you can quickly add sortable behaviour to your table.
    Since you need to be able to mix header rows and body rows, you might try the connectWith option:

    <body>
    <table>
        <tr class="connectedSortable">
            <th>Column1</th>
            <th>Column2</th>
            <th>Column3</th>
            <th>Column4</th>
            <th>Column5</th>
        </tr>
        <tr class="connectedSortable">
            <td>item1</td>
            <td>item2</td>
            <td>item3</td>
            <td>item4</td>
            <td>item5</td>
        </tr>
        <tr class="connectedSortable">
            <td>item11</td>
            <td>item22</td>
            <td>item33</td>
            <td>item44</td>
            <td>item55</td>
        </tr>
    </table>

    <script type="text/javascript">
        (function($){
            $(document).ready(function(){
                $('table tr').sortable({
                    connectWith: ".connectedSortable"
                });
            });
        })(jQuery);
    </script>

</body>
    • 0