Notes

  • In v2.27.9, added `sortTbody_lockHead` option. Thanks to Chris Rogers!
  • This widget (v2.22.2) allows the sorting of tbodies (not rows) based on a specified row set by the sortTbody_primaryRow option.
  • This widget replaces the cssInfoBlock setting:
    • The value is replaced with the value from sortTbody_noSort option so as to include info-only tbodies in the tbody sort.
    • Due to this modification, tbodies with colspan and rowspan cells may not sort or filter as expected, so it would be best to avoid colspan and rowspan cells in the primary row!
  • This widget also modifies the serverSideSorting option:
    • This value is set to true to disable tbody internal row sorting.
    • This value is set to false (default) when the sortTbody_sortRows widget option is true.
    • This modification should not dramatically affect other widgets; at least none that I can think of right now.

  • In these demos,
    • Primary Rows are styled with a light yellow background as an indicator.
    • The primary row color difference is important in the third table when the sorting of internal rows is enabled (sortTbody_sortRows is true).
    • The first two tables:
      • Primary rows are clickable. Clicking on them toggles the sibling rows (in the first table), or child rows (in the second table).
      • Primary rows have a dark top border to add a visual separation of each tbody.
      • *NOTE* when filtering the content of the first table, sibling rows that do not match the query will be hidden. Toggling their view is only possible because the "filtered" class (used by the filter widget & set by the filter_filteredRow widget option) is toggled.

  • *ALERT* This widget requires tablesorter v2.22.2+ and jQuery 1.4+

Options

TIP! Click on the link in the option column to reveal full details (or toggle|show|hide all) or double click to update the browser location.
OptionDefaultDescription
false When true, the primary row will be moved to the top of the sorted tbody.

Setting this option will also require setting the sortTbody_sortRows option to true. See the Sort tbodies and lock the header (primary) row demo below.
null Set this option to a string containing a jQuery selector pointing to the primary row to use for tbody sorting.

If a sortable tbody does not contain a primary row, or the primary row is not found, it will be sorted at the bottom of the table.

In these demos, all primary rows have a class name of "main", so this option is then set as follows:

sortTbody_primaryRow : '.main'

*NOTE* This will accept any jQuery selector, so it is possible to target multiple classes '.main, .primary', but only the first found cell in the sorted column will be used when sorting the tbody.

*WARNING* This widget was not designed to deal with colspan or rowspan within the primary row, so it is best to avoid them.
sortTbody_sortRows false When true, all rows within each tbody will also be sorted; the primary row is included!
sortTbody_noSort 'tablesorter-no-sort-tbody' Add the class name from this option to any tbodies that are to remain static. They will not be sorted.

Demo

Sort info-only tbodies by their primary row
Rank First Name Last Name Superhero Name
3BruceWayneBatman
Batman is the superhero protector of Gotham City, a man dressed like a bat who fights against evil and strikes terror into the hearts of criminals everywhere. In his secret identity he is Bruce Wayne, billionaire industrialist and notorious playboy. Although he has no superhuman powers, he is one of the world's smartest men and greatest fighters. His physical prowess and technical ingenuity make him an incredibly dangerous opponent. He is also a founding member of the Justice League and the Outsiders.
4HalJordanGreen Latern
Hal Jordan is the most well-known Green Lantern. He was the first earthman ever inducted into the Green Lantern Corps, and has been heralded as possibly the greatest Green Lantern of all time. Green Lantern is also a founding member of the Justice League of America.
2ClarkKentSuperman
Superman, also known as the Man of Steel, is one of the most powerful superheroes in the DC Universe. His abilities include incredible super-strength, super-speed, invulnerability, freezing breath, flight, and heat-vision.
5CharlesXavierProfessor X
Charles Francis Xavier was born in New York City to the wealthy Brian Xavier, a well-respected nuclear scientist, and Sharon Xavier. After Brian died in an accident, his science partner Kurt Marko comforts and marries the grieving Sharon. When Xavier's telepathic mutant powers emerge, he discovers Kurt cares only about his mother's money.
1SusanRichardsInvisible Woman
Susan's primary power deals with light waves, allowing her to render herself and others invisible.

Sort tbodies by their primary row (using child rows for extra info)
Rank First Name Last Name Superhero Name
3BruceWayneBatman
Batman is the superhero protector of Gotham City, a man dressed like a bat who fights against evil and strikes terror into the hearts of criminals everywhere. In his secret identity he is Bruce Wayne, billionaire industrialist and notorious playboy. Although he has no superhuman powers, he is one of the world's smartest men and greatest fighters. His physical prowess and technical ingenuity make him an incredibly dangerous opponent. He is also a founding member of the Justice League and the Outsiders.
4HalJordanGreen Latern
Hal Jordan is the most well-known Green Lantern. He was the first earthman ever inducted into the Green Lantern Corps, and has been heralded as possibly the greatest Green Lantern of all time. Green Lantern is also a founding member of the Justice League of America.
2ClarkKentSuperman
Superman, also known as the Man of Steel, is one of the most powerful superheroes in the DC Universe. His abilities include incredible super-strength, super-speed, invulnerability, freezing breath, flight, and heat-vision.
5CharlesXavierProfessor X
Charles Francis Xavier was born in New York City to the wealthy Brian Xavier, a well-respected nuclear scientist, and Sharon Xavier. After Brian died in an accident, his science partner Kurt Marko comforts and marries the grieving Sharon. When Xavier's telepathic mutant powers emerge, he discovers Kurt cares only about his mother's money.
1SusanRichardsInvisible Woman
Susan's primary power deals with light waves, allowing her to render herself and others invisible.

sortTbody_sortRows: (sort internal rows)
Sortable & non-sortable tbodies
# ID First Last State Info
# ID First Last State Info
1337DeniseHarrisCTlectus tortor vestibulum
2268BrienBarrowKYipsum aenean eros
3665MikelAbsalomFLamet vestibulum adipiscing
4540LaShondaBuikemaSDpulvinar at consectetur
Tbody "tablesorter-no-sort-tbody" spacer 1
5212LeifChoateUTporttitor mattis sit
6367ErickaRagusaMAat sollicitudin hendrerit
7136WaddieMaynardNHsollicitudin ac mi
8305KenWeissmannAKmagna sit at
Tbody "tablesorter-no-sort-tbody" spacer 2
9983PetrKunselmanWIamet convallis eros
10306MelanieNaborsMAtincidunt risus porttitor
11345EmilCorsonMOdui aliquam aliquam
12335TheodoreBrillWVsit pulvinar eros
Tbody "tablesorter-no-sort-tbody" spacer 3
13430NishalSmithDEtortor tincidunt porttitor
14470SherylScheppeIDsed massa hendrerit
15795ChristopherPollardCTsed lacus adipiscing
16400RaymondJessicaINmi vestibulum amet
Tbody "tablesorter-no-sort-tbody" spacer 4
17927DonovanJoslinMNamet augue aliquam
18882NingMccollumKSsed egestas vestibulum
19772SarahRadistDEipsum odio dui
20975AishaBadertscherCTmi nec massa

Sort tbodies and lock the header (primary) row
DealerJanFebMarAprMayJunJulAugSepOctNovDec
Dealer 48 JanFebMarAprMayJunJulAugSepOctNovDec
Site 3778419733136166158581701549225
Site 1815118711291155748192521403109
Site 251772412516811612212314113104166
Site 4131461885637162160178733999165
Site 2087206561871391715975108119171
Dealer 29 JanFebMarAprMayJunJulAugSepOctNovDec
Site 345251881213163189150635750189
Site 1812261211699013165741887818082
Site 25721518338121235549211318538
Site 4796253173181939584857129
Site 2033511751041251231566615984117
Dealer 62 JanFebMarAprMayJunJulAugSepOctNovDec
Site 385561687811510481511442010560
Site 1818928768816971941443147192176
Site 25156145132811931301029196489937
Site 415453158311191843291698746
Site 2013194182174481771571913485176
Dealer 25 JanFebMarAprMayJunJulAugSepOctNovDec
Site 31755819618688464109187167109104
Site 18109253170163116361254357179194
Site 2510913169411662038175691801768
Site 4129281376138701562001411787670
Site 20365691621141791011575614913485

Page Header

<link rel="stylesheet" href="../css/theme.blue.css">
<script src="js/jquery-latest.min.js"></script>
<script src="../js/jquery.tablesorter.js"></script>

<!-- Tablesorter: widgets (optional) -->
<script src="../js/jquery.tablesorter.widgets.js"></script>
<script src="../js/widgets/widget-sortTbodies.js"></script>

CSS


	

	
Javascript

	

		

	

	
HTML