Sortable Tables Script

  1. Include the Javascript library, by putting a link to it in the HEAD of your page, like so:
    <script src="sorttable.js">
  2. Mark your table as a sortable one by giving it a class of "sortable":
    <table class="sortable">
  3. Ensure that your table has an ID:
    <table class="sortable" id="unique_id">

And that's all you need. Your table will now have column sorting available by clicking the headers. For niceness, you might want to add the following styles to your stylesheet, or make up some of your own based on this:


/* Sortable tables */
table.sortable a.sortheader {
    background-color:#eee;
    color:#666666;
    font-weight: bold;
    text-decoration: none;
    display: block;
}
table.sortable span.sortarrow {
    color: black;
    text-decoration: none;
}

The Javascript library (sorttable.js):

Test the script
NameSalaryExtensionStart date
Bloggs, Fred$12000.00 135318/08/2003
Turvey, Kevin$191200.00 234202/05/1979
Mbogo, Arnold$32010.12 275509/08/1998
Shakespeare, Bill$122000.00 321112/11/1961
Shakespeare, Hamnet$9000 900501/01/2002
Fitz, Marvin$3300 555422/05/1995