title: jquery sort table columns
body: <p>Need to sort columns of a table using jquery.<br>
  Trying to just add the sort feature to an already existing table as below. But, not working and need help with it please.</p>
  
  <p>mytest.js</p>
  
  <pre><code>$(document).ready(function() {
      $('#table1').dataTable( { 
      "bFilter": false,
      "bLengthChange": false,
  
      "aoColumns": [  { "sType": 'num-html' }, 
                      { "sType": 'num-html' },
                      { "sType": 'num-html' },
                      { "sType": 'num-html' },
                      { "sType": 'num-html' },
                      { "sType": 'num-html' }, 
                      { "sType": 'num-html' },
                      { "sType": 'num-html' }, 
                      { "sType": 'num-html' }
      ]   
     } );
  });
  </code></pre>
  
  <p>jsp file</p>
  
  <pre><code>....
  &lt;link rel="stylesheet" href="&lt;%=cssPath %&gt;sort_table.css"&gt;
  &lt;script src="&lt;%=jsPath%&gt;mytest.js"&gt;&lt;/script&gt;
  &lt;script src="&lt;%=jsPath%&gt;jquery.dataTables.js"&gt;&lt;/script&gt;
  &lt;script&gt;   
  
  jQuery.fn.dataTableExt.oSort['num-html-asc']  = function(a,b) { 
     var x = a.replace( /&lt;.*?&gt;/g, "" ); 
     var y = b.replace( /&lt;.*?&gt;/g, "" ); 
     x = parseFloat( x ); 
     y = parseFloat( y ); 
     return ((x &lt; y || isNaN(y) ) ? -1 : ((x &gt; y || isNaN(x)) ?  1 :    0)); 
  }; 
  
  jQuery.fn.dataTableExt.oSort['num-html-desc'] = function(a,b) { 
      var x = a.replace( /&lt;.*?&gt;/g, "" ); 
      var y = b.replace( /&lt;.*?&gt;/g, "" ); 
      x = parseFloat( x ); 
      y = parseFloat( y ); 
      return ((x &lt; y || isNaN(x)) ?  1 : ((x &gt; y || isNaN(y) ) ? -1 : 0)); 
  };
  
  &lt;/script&gt;
  
  &lt;html&gt;
  &lt;body&gt;
       .......
       &lt;table class="dataTable" id="table1" width="100%"&gt;
         &lt;tr&gt;
           &lt;td&gt;
              &lt;table class="table" width="100%"&gt;
                 &lt;thead&gt;
                      &lt;td&gt;column1&lt;/td&gt;
                      &lt;td&gt;column2&lt;/td&gt;
          ...
                 &lt;/thead&gt;
              &lt;/table&gt;
              &lt;div&gt; //scrollable div
                &lt;table class="table" width="100%"&gt;
                  &lt;tr&gt;
                      &lt;td&gt;column1&lt;/td&gt;
                      &lt;td&gt;column2&lt;/td&gt;
          ...
                  &lt;/tr&gt;
                &lt;/table&gt;
              &lt;/div&gt;
           &lt;/td&gt;
         &lt;/tr&gt;
       &lt;/table&gt;
    &lt;/body&gt;
    &lt;/html&gt;
  </code></pre>
  
  <p>How to set the datatable sort columns??</p>