1
0
mirror of https://github.com/DataTables/DataTables.git synced 2025-01-18 11:52:11 +01:00

Fix: Captions which were positioned using caption-side:bottom (CSS) would be positioned incorrectly if using a scrolling table. Need to work around webkit bug 83867 to address this and add an empty tfoot element if one is not given - 2022

This commit is contained in:
Allan Jardine 2012-04-13 09:25:47 +01:00
parent 4be9b362c8
commit 0518525f59
3 changed files with 54 additions and 8 deletions

View File

@ -2970,11 +2970,20 @@
nScrollFootTable.style.marginLeft = "0";
}
/* Move any caption elements from the body to the header */
var nCaptions = $(oSettings.nTable).children('caption');
for ( var i=0, iLen=nCaptions.length ; i<iLen ; i++ )
/* Move caption elements from the body to the header, footer or leave where it is
* depending on the configuration. Note that the DTD says there can be only one caption */
var nCaption = $(oSettings.nTable).children('caption');
if ( nCaption.length > 0 )
{
nScrollHeadTable.appendChild( nCaptions[i] );
nCaption = nCaption[0];
if ( nCaption._captionSide === "top" )
{
nScrollHeadTable.appendChild( nCaption );
}
else if ( nCaption._captionSide === "bottom" && nTfoot )
{
nScrollFootTable.appendChild( nCaption );
}
}
/*
@ -6508,6 +6517,12 @@
* Final init
* Cache the header, body and footer as required, creating them if needed
*/
// Work around for Webkit bug 83867 - store the caption-side before removing from doc
var captions = $(this).children('caption').each( function () {
this._captionSide = $(this).css('caption-side');
} );
var thead = $(this).children('thead');
if ( thead.length === 0 )
{
@ -6528,6 +6543,14 @@
oSettings.nTBody.setAttribute( "aria-relevant", "all" );
var tfoot = $(this).children('tfoot');
if ( tfoot.length === 0 && captions.length > 0 && (oSettings.oScroll.sX !== "" || oSettings.oScroll.sY !== "") )
{
// If we are a scrolling table, and no footer has been given, then we need to create
// a tfoot element for the caption element to be appended to
tfoot = [ document.createElement( 'tfoot' ) ];
this.appendChild( tfoot[0] );
}
if ( tfoot.length > 0 )
{
oSettings.nTFoot = tfoot[0];

View File

@ -370,6 +370,12 @@ _fnSortingClasses( oSettings );
* Final init
* Cache the header, body and footer as required, creating them if needed
*/
// Work around for Webkit bug 83867 - store the caption-side before removing from doc
var captions = $(this).children('caption').each( function () {
this._captionSide = $(this).css('caption-side');
} );
var thead = $(this).children('thead');
if ( thead.length === 0 )
{
@ -390,6 +396,14 @@ oSettings.nTBody.setAttribute( "aria-live", "polite" );
oSettings.nTBody.setAttribute( "aria-relevant", "all" );
var tfoot = $(this).children('tfoot');
if ( tfoot.length === 0 && captions.length > 0 && (oSettings.oScroll.sX !== "" || oSettings.oScroll.sY !== "") )
{
// If we are a scrolling table, and no footer has been given, then we need to create
// a tfoot element for the caption element to be appended to
tfoot = [ document.createElement( 'tfoot' ) ];
this.appendChild( tfoot[0] );
}
if ( tfoot.length > 0 )
{
oSettings.nTFoot = tfoot[0];

View File

@ -89,11 +89,20 @@ function _fnFeatureHtmlTable ( oSettings )
nScrollFootTable.style.marginLeft = "0";
}
/* Move any caption elements from the body to the header */
var nCaptions = $(oSettings.nTable).children('caption');
for ( var i=0, iLen=nCaptions.length ; i<iLen ; i++ )
/* Move caption elements from the body to the header, footer or leave where it is
* depending on the configuration. Note that the DTD says there can be only one caption */
var nCaption = $(oSettings.nTable).children('caption');
if ( nCaption.length > 0 )
{
nScrollHeadTable.appendChild( nCaptions[i] );
nCaption = nCaption[0];
if ( nCaption._captionSide === "top" )
{
nScrollHeadTable.appendChild( nCaption );
}
else if ( nCaption._captionSide === "bottom" && nTfoot )
{
nScrollFootTable.appendChild( nCaption );
}
}
/*