return false;
}
- function getElementText( node ) {
+ function getElementSortKey( node ) {
var $node = $( node ),
// Use data-sort-value attribute.
// Use data() instead of attr() so that live value changes
// like charAt, toLowerCase and split are expected.
return String( data );
} else {
- return $node.text();
+ if ( node.tagName.toLowerCase() === 'img' ) {
+ return $node.attr( 'alt' ) || ''; // handle undefined alt
+ } else {
+ return $.map( $.makeArray( node.childNodes ), function( elem ) {
+ // 1 is for document.ELEMENT_NODE (the constant is undefined on old browsers)
+ if ( elem.nodeType === 1 ) {
+ return getElementSortKey( elem );
+ } else {
+ return $.text( elem );
+ }
+ } ).join( '' );
+ }
}
}
function getTextFromRowAndCellIndex( rows, rowIndex, cellIndex ) {
if ( rows[rowIndex] && rows[rowIndex].cells[cellIndex] ) {
- return $.trim( getElementText( rows[rowIndex].cells[cellIndex] ) );
+ return $.trim( getElementSortKey( rows[rowIndex].cells[cellIndex] ) );
} else {
return '';
}
cache.row.push( $row );
for ( var j = 0; j < totalCells; ++j ) {
- cols.push( parsers[j].format( getElementText( $row[0].cells[j] ), table, $row[0].cells[j] ) );
+ cols.push( parsers[j].format( getElementSortKey( $row[0].cells[j] ), table, $row[0].cells[j] ) );
}
cols.push( cache.normalized.length ); // add position for rowCache
return false;
}
- function setHeadersCss( table, $headers, list, css, msg ) {
+ function setHeadersCss( table, $headers, list, css, msg, columnToHeader ) {
// Remove all header information and reset titles to default message
$headers.removeClass( css[0] ).removeClass( css[1] ).attr( 'title', msg[1] );
- var h = [];
- $headers.each( function () {
- if ( !this.sortDisabled ) {
- h[this.column] = $( this );
- }
- } );
-
- var l = list.length;
- for ( var i = 0; i < l; i++ ) {
- h[ list[i][0] ].addClass( css[ list[i][1] ] ).attr( 'title', msg[ list[i][1] ] );
+ for ( var i = 0; i < list.length; i++ ) {
+ $headers.eq( columnToHeader[ list[i][0] ] )
+ .addClass( css[ list[i][1] ] )
+ .attr( 'title', msg[ list[i][1] ] );
}
}
return $tables.each( function ( i, table ) {
// Declare and cache.
var $headers, cache, config,
+ headerToColumns, columnToHeader, colspanOffset,
$table = $( table ),
firstTime = true;
table.config.parsers = buildParserCache( table, $headers );
}
+ // as each header can span over multiple columns (using colspan=N),
+ // we have to bidirectionally map headers to their columns and columns to their headers
+ headerToColumns = [];
+ columnToHeader = [];
+ colspanOffset = 0;
+ $headers.each( function ( headerIndex ) {
+ var columns = [];
+ for ( var i = 0; i < this.colSpan; i++ ) {
+ columnToHeader[ colspanOffset + i ] = headerIndex;
+ columns.push( colspanOffset + i );
+ }
+
+ headerToColumns[ headerIndex ] = columns;
+ colspanOffset += this.colSpan;
+ } );
+
// Apply event handling to headers
// this is too big, perhaps break it out?
$headers.filter( ':not(.unsortable)' ).click( function ( e ) {
var totalRows = ( $table[0].tBodies[0] && $table[0].tBodies[0].rows.length ) || 0;
if ( !table.sortDisabled && totalRows > 0 ) {
-
- // Get current column index
- var i = this.column;
-
// Get current column sort order
this.order = this.count % 2;
this.count++;
- // User only wants to sort on one column
- if ( !e[config.sortMultiSortKey] ) {
- // Flush the sort list
- config.sortList = [];
- // Add column to sort list
- config.sortList.push( [i, this.order] );
+ var cell = this;
+ // Get current column index
+ var columns = headerToColumns[this.column];
+ var newSortList = $.map( columns, function (c) {
+ // jQuery "helpfully" flattens the arrays...
+ return [[c, cell.order]];
+ });
+ // Index of first column belonging to this header
+ var i = columns[0];
- // Multi column sorting
+ if ( !e[config.sortMultiSortKey] ) {
+ // User only wants to sort on one column set
+ // Flush the sort list and add new columns
+ config.sortList = newSortList;
} else {
- // The user has clicked on an already sorted column.
+ // Multi column sorting
+ // It is not possible for one column to belong to multiple headers,
+ // so this is okay - we don't need to check for every value in the columns array
if ( isValueInArray( i, config.sortList ) ) {
+ // The user has clicked on an already sorted column.
// Reverse the sorting direction for all tables.
for ( var j = 0; j < config.sortList.length; j++ ) {
var s = config.sortList[j],
o = config.headerList[s[0]];
- if ( s[0] === i ) {
+ if ( isValueInArray( s[0], newSortList ) ) {
o.count = s[1];
o.count++;
s[1] = o.count % 2;
}
}
} else {
- // Add column to sort list array
- config.sortList.push( [i, this.order] );
+ // Add columns to sort list array
+ config.sortList = config.sortList.concat( newSortList );
}
}
// Set CSS for headers
- setHeadersCss( $table[0], $headers, config.sortList, sortCSS, sortMsg );
+ setHeadersCss( $table[0], $headers, config.sortList, sortCSS, sortMsg, columnToHeader );
appendToTable(
$table[0], multisort( $table[0], config.sortList, cache )
);
cache = buildCache( table );
// set css for headers
- setHeadersCss( table, $headers, sortList, sortCSS, sortMsg );
+ setHeadersCss( table, $headers, sortList, sortCSS, sortMsg, columnToHeader );
// sort the table and append it to the dom
appendToTable( table, multisort( table, sortList, cache ) );