jQuery draggable table rows
<p>I'm displaying data from the database into a table. Now I want to change the order of the rows in the database by dragging and dropping my  rows </p>

<pre><code>&lt;table id="test_sortable"&gt;
    &lt;tr class="odd localHost" id="1"&gt;
        &lt;td&gt;Shuttle&lt;/td&gt;
        &lt;td&gt;Internet
             Explorer 4.0&lt;/td&gt;
        &lt;td&gt;Win 95+&lt;/td&gt;
    &lt;/tr&gt;
    &lt;tr class="even remoteHost" id="2"&gt;
        &lt;td&gt;Shuttle&lt;/td&gt;
        &lt;td&gt;Internet
             Explorer 5.0&lt;/td&gt;
        &lt;td&gt;Win 95+&lt;/td&gt;
    &lt;/tr&gt;
&lt;/table&gt;
</code></pre>

<p>With jQuery UI it's pretty easy to implement this functionality which I am doing like this:</p>

<pre><code>&lt;script type="javascript"&gt;
    $(function() {
        var new_position;
        var old_position;

        $( "#test_sortable" ).sortable({
            cursor: 'move',
            opacity: '0.5',

            start: function(e, ui) {
               // puts the old positions into array before sorting
               old_position = $(this).sortable('toArray');
           },
           update: function(event, ui) {
               // grabs the new positions now that we've finished sorting
               new_position = $(this).sortable('toArray');
               console.log(new_position);
           }
        });
        $( "#test_sortable" ).disableSelection();
    });
&lt;/script&gt;
</code></pre>

<p>Now I would like to know what row is replaced, and how I can implement this in a the database if my table would look like this: </p>

<pre><code>ID | NAME | ORDER
1    test   1
3    test2  2
4    test3  3
</code></pre>

<p>When should the ajax call be triggered and do I have to loop over all my rows in the database if I only change 1 row? What would my execution query look like ?</p>

<p>Thanks in advance.</p>
