Matt RaibleMatt Raible is a Java Champion and Developer Advocate at Okta. developer.okta.com

The JHipster Mini-Book The JHipster Mini-Book is a guide to getting started with hip technologies today: Angular, Bootstrap, and Spring Boot. All of these frameworks are wrapped up in an easy-to-use project called JHipster.

This book shows you how to build an app with JHipster, and guides you through the plethora of tools, techniques and options you can use. Furthermore, it explains the UI and API building blocks so you understand the underpinnings of your great application.

For book updates, follow @jhipster-book on Twitter.

10+ YEARS


Over 10 years ago, I wrote my first blog post. Since then, I've authored books, had kids, traveled the world, found Trish and blogged about it all.

Display Tag: Static Headers

One of the requests we get over on the display tag project is a way to have static headers. Basically, this means that a user could scroll down through all the records on a page and the header would stay in place. The next generation of the tag library has a <thead> and <tbody> that makes this fairly easy to do. For instance, just by adding style="height: 400px; overflow: auto" to the <tbody> tag - you get the desired effect. Cool stuff - only seems to work in Mozilla though. Any IE/CSS experts out there that can explain why it doesn't work in IE?

See Also: Display Tag: Static Headers - Revisited

Posted in Java at Aug 16 2003, 03:16:06 PM MDT 19 Comments
Comments:

Matt, when are we likely to see a new release of this? I like what I've seen already, but I know from reading your blog that there's some cool enhancements in the pipeline.

Posted by Graham on August 16, 2003 at 09:50 PM MDT #

Soon - I'd say within the next week or so. We just got done voting (and deciding) on two different refactorings of the tag. We plan to release a beta shortly.

Posted by Matt Raible on August 16, 2003 at 10:05 PM MDT #

Sweet, thanks. BTW I don't read many blogs, but your's is always interesting, and not full of waffle like so many others. I'm sure many appreciate the effort you put in - I'm not sure I could do it :-)

Posted by Graham on August 16, 2003 at 11:44 PM MDT #

http://webfx.eae.net/dhtml/syncscroll/syncscroll.html

Posted by mpm on August 17, 2003 at 12:36 PM MDT #

Hey Matt,
How do I get the next version of the display library?
I see the sample pages on your website.
However, I am not able to connect to the CVS server (as anonymous).
/ Is there a way I can get the source jar of next release (0.9 / 2.0)?
/
Thanks,
--ajay

Posted by Ajay Koranne on September 19, 2003 at 02:58 PM MDT #

Hi Matt, I am waiting for the new version of display tag, that can give 'Static Header' facility according to previous postings. Also what I should do if I just want to modify perticular class without switching to newer version to make it working? I would appreciate, If I come to know the what class and code snippet that I modify and rebuild the jar of older version of tag lib to get the 'Static Header' for table tag. Thanks Jasmin

Posted by Jasmin Mehta on September 22, 2003 at 03:29 PM MDT #

Jasmin - a beta version of the newest displaytag should be out in the next few days.

Posted by Matt Raible on September 23, 2003 at 05:47 AM MDT #

Hi,
I came to know from one of the email from display-tag user group that Ver. 1.0-b2 is out. Can you pl tell me that if this version has a facility to give static header and scrollable body for the table - that works on IE?

Its very urgent requirement of my project.

Pl let me know how can I fix that?

Thanks
Jasmin

Posted by Jasmin Mehta on December 04, 2003 at 08:39 AM MST #

At the bottom of the Display Tag FAQ is your answer:

<strong>How can I display static headers in a table, so that headers remain visible while user scrolls the table body?</strong>

You can do that simply using css, adding an height and the overflow: scroll property to the tbody element. Unfortunately this will work perfectly in Netscape/Mozilla, but not in Internet Explorer. If you want to do something similar in IE you will probably need to play with javascript. The table tag can't be used to display a split table (a table with headers only and a table with a body), sorry. This is simply because a correct, xhtml, accessible table MUST have headers and a body.

Posted by Matt Raible on December 04, 2003 at 10:25 AM MST #

Jasmin, I send a couple of samples to you. But, your email is bouncing back. If you still need it, send me an email from a different account. Matt, would you mind, putting the samples on your site? Thanks, --ajay

Posted by Ajay Koranne on December 04, 2003 at 11:29 AM MST #

Ajay - the example you sent uses a number of different tables and lots of JavaScript. This won't work with the Display Tag (as far as I know) because you don't really have any control over the HTML it generates, unless you hack the code. Here's a new sample I whipped up that shows you the clean Mozilla way, and the not-so-clean IE way (that works in Mozilla). <em>Enjoy!</em>

Posted by Matt Raible on December 04, 2003 at 02:41 PM MST #

Hi, I have a big problem with this code: <html>... <style> td.nowrap {width:80px; white-space:nowrap} </style> <body>... <table> <tr> <td>xxxxxxxxxx kkkkkkkk llllll ppppppppppppppp ddddddkkkkkkkkkkkkkkkkkkkkkkkkkk-1 </td> <tr> </table> </html> REASON: I'd like to use the size cell to 80px and to avoid the word wrap, but this doesn't work. Could oyu help me? tkx advanced.

Posted by Jesus romero on January 09, 2004 at 08:05 PM MST #

Hi Matt, I am trying to access the URL you mentioned ("http://raibledesigns.com/resume/sandbox/staticHeader.html"), but it is not accessible. Manish

Posted by Manish Jain on February 10, 2004 at 06:47 AM MST #

The new URL is at http://homepage.mac.com/mraible/demos/staticHeaders.html.

Posted by Matt Raible on February 10, 2004 at 06:59 AM MST #

If the number of rows is small, they will expand to fill the size of the new tbody height (in mozilla). Have you found any way aroud this?

Posted by Torgeir on May 05, 2004 at 04:17 AM MDT #

hi matt, i'm having problem wid display tag and as far as i can see it u'r the best person to ask about dis,.. please help... i nid my display tag table to render long data in a column without wrapping it so that the row data is only one line .... can u please help me wid dis one? thanks matt,

Posted by angela_gs on February 04, 2007 at 08:39 PM MST #

I know my reply is very late.

I have read some where that giving position:relative to tr and to giving overflow:auto to a div enclosing the table will kind of make it work in IE. I think it makes the tr to behave as if it is static.

Posted by Akhil on May 28, 2008 at 05:13 AM MDT #

does not work in IE7? Is there any working example in all the browsers tried both, http://homepage.mac.com/mraible/demos/staticHeaders.html and http://www.imaputz.com/cssStuff/bigFourVersion.html#

Posted by krishna on August 26, 2008 at 10:41 AM MDT #

Found this new version: http://velusaravana.wordpress.com/2010/10/12/displaytag-table-scroll-with-fixed-header/

Posted by lesele on October 17, 2011 at 11:20 PM MDT #

Post a Comment:
  • HTML Syntax: Allowed