diff --git a/docs/example-widget-grouping.html b/docs/example-widget-grouping.html index 3361378d..da78f207 100644 --- a/docs/example-widget-grouping.html +++ b/docs/example-widget-grouping.html @@ -97,7 +97,22 @@ } // If there are empty cells, name the group "Empty" return txt === "" ? "Empty" : txt; - } + }, + group_callback : function($cell, $rows, column, table){ + // callback allowing modification of the group header labels + // $cell = current table cell (containing group header cells '.group-name' & '.group-count' + // $rows = all of the table rows for the current group; table = current table (DOM) + // column = current column being sorted/grouped + if (column === 2) { + var subtotal = 0; + $rows.each(function(){ + subtotal += parseInt( $(this).find('td').eq(column).text() ); + }); + $cell.find('.group-count').append('; subtotal: ' + subtotal ); + } + }, + // event triggered on the table when the grouping widget has finished work + group_complete : 'groupingComplete' } }); @@ -122,6 +137,7 @@
group_callback
& group_complete
options. See options section below for details.widgetOptions
)group_collapsible
- when true
the group headers become clickable and collapse the rows below it.group_collapsed
- when true
and group_collapsible
is also true
, all groups will start collapsed (v2.11).group_count
- Allows you to add custom formatting, or remove, the group count within the group header. Set it to false
or an empty string to remove the count.group_months
, group_week
and group_time
- Name arrays included so that the language of the date groups can be modified easily.group_formatter
- Use this function to modify the group header text before it gets applied. It provides various parameters to make it work for any of the table columns and data. See the comments in the example below for more details.group_collapsible
(true
) - when true
, the group headers become clickable and collapse the rows below it.group_collapsed
(false
) - when true
and group_collapsible
is also true
, all groups will start collapsed (v2.11).group_count
(" ({num})"
) - allows you to add custom formatting, or remove, the group count within the group header. Set it to false
or an empty string to remove the count.group_months
([ "Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec" ]
) - Month names.group_week
([ "Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday" ]
) - Named days of the week.group_time
([ "AM", "PM" ]
) - Time of day.group_formatter
(null
) - use this function to modify the group header text before it gets applied. It provides various parameters (txt, col, table, c, wo
) to make it work for any of the table columns and data. See the comments in the example below for more details.
+ txt
- current text of the group header.col
- current table column being grouped (zero-based index).table
- current table (DOM).c
- table data from table.config
.wo
- table widget options from table.config.widgetOptions
.group_callback
(null
) - use this function to further modify the group header to include more information (i.e. group totals). Parameters include ($cell, $rows, column, table
). See the example below for more details v2.12.
+ $cell
- current group header table cell (jQuery object).$rows
- current group rows (jQuery object).column
- current table column being grouped (zero-based index).table
- current table (DOM).group_complete
("groupingComplete"
) - event triggered on the table when the grouping widget has finished work v2.12."group-word"
(same as "group-word-1"
) - group the rows using the first word it finds in the column's parsed data."group-word-n"
("n"
can be any number) - group the rows using the nth word in the column*."group-letter"
(same as "group-letter-1"
) - group the rows using the first letter it finds in the column's parsed data."group-letter-n"
("n"
can be any number) - group the rows using letters 1 through n (if n = 2, then it's the first 2 letters) in the column's parsed data."group-number"
(same as "group-number-1"
) - group the rows by the number it finds in the column (step of one)."group-number-n"
("n"
can be any number) - group the rows into blocks of every n values. So, if n = 10, the groups will be 0-9, 10-19, 20-29, etc"group-date"
- group the rows by full date (this shows the current UTC time corrected for your time zone)"group-date-year"
- group the rows by year"group-date-month"
- group the rows by month*"group-date-day"
- group the rows by month/day*"group-date-week"
- group the rows by day of the week*"group-date-time"
- group the rows by time*"group-false"
- disable grouping of rows for a column (v2.11)."group-word"
(same as "group-word-1"
) - group the rows using the first word it finds in the column's parsed data."group-word-n"
("n"
can be any number) - group the rows using the nth word in the column*."group-letter"
(same as "group-letter-1"
) - group the rows using the first letter it finds in the column's parsed data."group-letter-n"
("n"
can be any number) - group the rows using letters 1 through n (if n = 2, then it's the first 2 letters) in the column's parsed data."group-number"
(same as "group-number-1"
) - group the rows by the number it finds in the column (step of one)."group-number-n"
("n"
can be any number) - group the rows into blocks of every n values. So, if n = 10, the groups will be 0-9, 10-19, 20-29, etc"group-date"
- group the rows by full date (this shows the current UTC time corrected for your time zone)"group-date-year"
- group the rows by year"group-date-month"
- group the rows by month*"group-date-day"
- group the rows by month/day*"group-date-week"
- group the rows by day of the week*"group-date-time"
- group the rows by time*"group-false"
- disable grouping of rows for a column (v2.11).widgetOptions
. Thanks to thezoggy for putting together this jQuery-widget compatibility table, but please note:
10
.saveSort
and resizable
widgets use the $.tablesorter.storage
function by default and thus need the parseJSON
function which is available in jQuery 1.4.1+.