Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    text
    copied!<p>Just do something like this:</p> <p>Say you have table like so:</p> <pre><code>&lt;table id='table'&gt; &lt;tr id='row1'&gt;&lt;td&gt; .... &lt;/td&gt;&lt;/tr&gt; &lt;tr id='row2'&gt;&lt;td&gt; .... &lt;/td&gt;&lt;/tr&gt; &lt;tr id='row3'&gt;&lt;td&gt; .... &lt;/td&gt;&lt;/tr&gt; &lt;tr id='row4'&gt;&lt;td&gt; .... &lt;/td&gt;&lt;/tr&gt; &lt;/table&gt; </code></pre> <p>And an array with the new order like this:</p> <pre><code>NewOrder[1] = 3; NewOrder[2] = 4; NewOrder[3] = 2; </code></pre> <p>Then, do some something like this (not tested, so you may need to tweak the code, but this is the idea):</p> <pre><code>for ( i=1; i&lt;=NewOrder.length; i++ ) { $('#row'+i).appendTo( '#table' ); } </code></pre> <p>This way, they are moved to the end of the table in order.</p> <p>So you will have 3 moved to the end, then 4 behind it, then 2 behind that, etc. After they have <strong>ALL</strong> been appended to the end of the table, the first one will become the first row, and the rest will be in the correct order behind it.</p> <p><strong>Edit:</strong></p> <p>Make the table style='display:none;' and then do $('#table').show(); at startup.</p> <p><strong>Edit Again:</strong> You could do a div around the entire body content, like </p> <pre><code>&lt;body&gt; &lt;div id='everything' style='display:none;'&gt; .... &lt;/div&gt; &lt;/body&gt; </code></pre> <p>So that the entire page will be hidden (just blank white) for the fraction of a second it takes to load and order the table.</p> <p>Then you would use:</p> <pre><code>$(function(){ $('#everything').show(); } </code></pre> <p>To show the entire page all at once as soon as the DOM is ready. It will take a fraction of a second longer for the page to load, but it will all load at once, so there won't be any flash of missing tables, etc. As long as EVERYTHING is in #everything, it will just look like the page loaded - should be transparent to the viewer.</p>
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload