Question

The table will get generated dynamically from the server-side code, which I have to sort based the chosen column from the combo box. I’m having 5 columns totally, includes input elements too…

I have searched for table sorting, but I’m getting the kind of codes which will get triggered when we click on the header. I don’t understand completely how it works. There is no need to reverse the sorting in my case.

I have got TSorter from terrill which didn’t work out well for me. I don’t understand what the mistake I have done…

I must do it with Javascript without using any JS framework. Any help would be appreciated….

My code snippet:

<script>
function init()
{
    var Table1Sorter = new TSorter;
    Table1Sorter.init('TableToSort');
}

window.onload = init;
</script>
<div id="sortElements">
  <table border=0 cellspacing=0 cellpadding=0 >
     <tr>
        <td>Sort By</td>
        <td>
           <select name="sortBy" >
             <option value="0">column 2</option>
             <option value="1">column 3</option>
             <option value="2">column 4</option>
           </select>
     </tr>
  </table>
</div>
<span>
<div id="tableContainer" >
<table id="TableToSort" border=0 cellspacing=0 cellpadding=0 >
<thead>
<tr>
  <th>Column 1</th>
  <th>Column 2</th>
  <th>Column 3</th>
  <th>Column 4</th>
  <th>Column 5</th>
</tr>
</thead>
<tbody>
<!-- My rows-->
</tbody>
</table>
</span>

Answer 1

The problem that I had was: I have made the clicking event by calling the event. It was supported in Firefox 9+ and Opera, Chrome are not supporting that event.