Extension talk:FixedHeaderTable

From mediawiki.org
Latest comment: 4 years ago by Irlws in topic Works, But Some Issues

Hi, thanks for the great extension! Is there any possibility to change the printable version of a page? Now the printable version shows exactly the part of the table which is visible on the browser including the scrollbars and not the whole one. I've tried to edit the "Mediawiki:Print.css" forcing wikitable rendering and hiding elements irrelevant for printing, but I was not successful. Unfortunately I'm not so familiar with CSS.

Any help/idea is highly appreciated. Thanks in advance!

MediaWiki 1.21.1, PHP 5.4.19, MySQL 5.5.32 --Deli68 (talk) 09:11, 17 February 2015 (UTC)Reply

Fix[edit]

Glad you like it and sorry for the late response! I plan to fix this in the next release, in the meantime, the easiest way to do this is to add an id to the containing div of the table and then apply overriding CSS to that div.

  1. Find your $IP/extensions/FixedHeaderTable/FixedHeaderTable.php file and look for the following line near the very bottom:
    $output = '<div style="%1$s">%2$s</div>';
    
  2. Change it to the following:
    $output = '<div id="fixedHeaderTableContainer" style="%1$s">%2$s</div>';
    
  3. Then, add the following to your "Mediawiki:Print.css" page:
    #fixedHeaderTableContainer {
        overflow: visible !important;
        height: auto !important;
        min-height: 450px !important;
        min-width: 100% !important;
    }
    
  4. Make sure you clear your browser's cache to see the changes.

Irlws (talk) 02:29, 26 February 2016 (UTC)Reply


Better late than never! Thank you! Works perfectly!
--Deli68 (talk) 13:07, 1 March 2016 (UTC)Reply

Works, But Some Issues[edit]

  • Thanks for this, it looks like exactly what I need, but there are several problems that are making it hard to use. I tried using it to create a table with just a fixed header row (no fixed columns), and observed the following (MW1.30):
    • Trying to set a fixed table height by using a CSS style in the table declaration results in the style being applied to the thead instead. I can wrap it in a div, and set the height there, but it seems odd that the table style would end up copied into the thead style.
    • The scrollbar is properly situated in the body, but it is still to the right of the entire table. This results in some aesthetic weirdness---if th's are styled with a background colour different from the table, you can see a small unstyled rectangle to the right of the thead, above the scrollbar.
      Edit: This is really more of a problem in the existing CSS for tables (such as used with wikitables), which assumes there are no theads and thus styles th's without also styling thead's.
    • Widths are not calculated quite correctly, as the overall width ends up just a little bit wider than the displayed area.
    • Looking at the html it generates, it seems to convert my table into a table within a table to do its magic. Is that intended? I suppose it works, more or less, but that approach is likely related to the above concerns. Why not just copy the header row into a generated thead within the same table (or maybe that's necessary just for fixed column support)?

--Clump (talk) 15:44, 27 January 2019 (UTC)Reply


All very good points. It's been a while since I've looked at the code but yes, I remember some of the strange table manipulation is related to how the wrapped version of the jQuery.fixedheadertable widget works. I also remember how width calculations were difficult to get consistent among the major browsers. Lots of things have changed since then, so now might be a good time for someone to revisit the concept. In fact, I've noticed you've submitted a new ScrollableTables extension to replace this one, so I'm looking forward to seeing your work there!
--Irlws (talk) 22:53, 29 June 2019 (UTC)Reply