jQuery tablesorter 2.0 - Static Row Widget

# tablesorter

## Static Row Widget

### Flexible client-side table sorting

Back to documentation

### Notes

- In v2.19.1, the `staticRow_event` option was added.

- This widget will only work in tablesorter version 2.8+.
- The widget was modified from Tablesorter-Static-Row-Plugin by ascii-soup (MIT license).
- It has been updated to work in tables with multiple tbodies, but not within information-only tbodies.
- This widget was not tested, nor was it meant to be used with the pager.
- Note This demo was updated to allow toggling of static rows.

### Options

### Group widget default options (added inside of tablesorter `widgetOptions`)

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.

Option | Default | Description
--- | --- | ---
staticRow_class | `".static"` | Set a class name to use to lock a row in place, include a period.
staticRow_data | `"static-index"` | Set the jQuery data name to use with the row element. This data name saves the row index, and is only available as an option to avoid conflicts.
staticRow_event | `"staticRowsRefresh"` | Set the event that the widget listens for to perform a refresh.
- staticRow_index | `"row-index"` | Use this data-attribute to set the desired static row location Set the desired location using either of these two methods: Use a zero-based index of the row
      <tr data-row-index="5">...</tr>
- Note setting this index to much more than the number of table rows ensures that it will stay at the bottom when adding new rows. Use a percentage if total rows within it's tbody
      <tr data-row-index="50%">...</tr>
These values take priority over the actual row index, so as shown in the "Single tbody" demo below, the header row is set to 50%, but initially, it is located at the top of the table. If these values are changed dynamically, the static row location can be updated

### Methods / Events

### Method

If adding or removing rows from the table, using any of the update methods will automatically refresh the static row indexes. Use the "Add Row" button below to test this.
To modify or refresh the static row indexing without updating, trigger a `staticRowsRefresh` event on the table:

    var $row = $("tr:contains('Iguana')");
    // move Iguana row down one (remember, this only works on static rows)
    $row.data('row-index', $row.data('row-index') + 1);
    $(table).trigger('staticRowsRefresh');

this allows moving a static row dynamically; try the Move "Ignuana" row buttons above the "Single tbody" demo.

### Event

A `staticRowsComplete` event is triggered after the static rows widget has completed moving the static rows back into place. Use it as follows:

    $(table).bind('staticRowsComplete', function(table) {
    	console.log('static rows applied to ' + table.id);
    });

# Demo

Note Make any row static or normal by toggling the `static` class name using `Ctrl` + left click (`⌘` + click on Mac)

### Single tbody

Move "Iguana" row:

Column 1 | Column 2 | Column 3
--- | --- | ---
Column 1 | Column 2 | Column 3
D | 4 | Dog
E | 5 | Emu
F | 6 | Frog
G | 7 | Goat
A | 1 | Anteater
B | 2 | Bear
C | 3 | Cat
H | 8 | Horse
I | 9 | Iguana
J | 10 | Jellyfish
V | 22 | Vole
W | 23 | Walrus
X | 24 | Xantis
K | 11 | Koala
L | 12 | Lemur
Q | 17 | Quail
R | 18 | Rhino
S | 19 | Seal
M | 13 | Mink
N | 14 | Nightingale
O | 15 | Octopus
P | 16 | Pig
T | 20 | Tiger
U | 21 | Urchin
Y | 25 | Yak
Z | 26 | Zebra
Total Count | Lots! |

#### Multiple tbody

Rank | First Name | Last Name | Age | Total | Discount | Date
--- | --- | --- | --- | --- | --- | ---
1 | Philip Aaron Wong | Johnson Sr Esq | 25 | $5.95 | 22% | Jun 26, 2004 7:22 AM
11 | Aaron | Hibert | 12 | $2.99 | 5% | Aug 21, 2009 12:21 PM
12 | Brandon Clark | Henry Jr | 51 | $42.29 | 18% | Oct 13, 2000 1:15 PM
111 | Peter | Parker | 28 | $9.99 | 20% | Jul 6, 2006 8:14 AM
21 | John | Hood | 33 | $19.99 | 25% | Dec 10, 2002 5:14 AM
013 | Clark | Kent Sr. | 18 | $15.89 | 44% | Jan 12, 2003 11:14 AM
Second tbody
005 | Bruce | Almighty Esq | 45 | $153.19 | 44% | Jan 18, 2021 9:12 AM
10 | Alex | Dumass | 13 | $5.29 | 4% | Jan 8, 2012 5:11 PM
16 | Jim | Franco | 24 | $14.19 | 14% | Jan 14, 2004 11:23 AM
166 | Bruce Lee | Evans | 22 | $13.19 | 11% | Jan 18, 2007 9:12 AM
100 | Brenda Dexter | McMasters | 18 | $55.20 | 15% | Feb 12, 2010 7:23 PM
55 | Dennis | Bronson | 65 | $123.00 | 32% | Jan 20, 2001 1:12 PM
9 | Martha | delFuego | 25 | $22.09 | 17% | Jun 11, 2011 10:55 AM

# Javascript

# CSS

# HTML