FixedHeader with horizontal scroll

domingo

Hi, is there a way to use FixedHeader with a wide table that has a horizontal scrollbar, so that it moves horizontally when the scrollbar is used

Image of how it looks
http://picasaweb.google.com/lh/photo/E1vZqIBW3pcEVWN6hWFKAA?feat=directlink

Another thing is that FixedHeader seems to disable multicolumn sort

Regards
Domingo

allan

Hi Domingo,

Horizontal scrolling: There isn't a method for doing this with fixed header at the moment. When I get a chance to update FixedHeader, this will be the first thing that I add in, as it's been requested a couple of times, but not sure when I'll get around to that, sorry :-)

Multi-column sorting: Yup - another issue I'm aware of. This is also on the to do list for FixedHeader as a bug. It's due to the way it hands the sorting 'click', the 'shift' key isn't dealt with.

So much to do :-)

Regards,
Allan

jnthnlstr

Another vote for supporting headers that spill out over the width of the table.

Image of my problem (the cloned header has been moved down so you can see what's going on):
http://img.skitch.com/20100110-qn9u2d18gpxcijrdmxj3s7mcpu.jpg

Thanks,


J.

jnthnlstr

Had a look into this - if you set the cloned table's width to the same width as the original table, that sorts out the width of the cloned header cells.

The problem now is that when you scroll down and the header gets "position:fixed", it pops out of the wrapper if you've set "overflow-x:auto", which is what I want.

Looking into how to constrain a position:fixed table within a container now...


J.

jnthnlstr

Ok, here's what I now know...

If you wrap the cloned table in a div, and then give that div the position:fixed, a width and overflow:auto; and then you give the cloned table a bigger width, it will overflow properly.

It would be great if FixedHeader supported this behaviour! It would mean the plugin has to set up the clone a bit differently.


J.

allan

Hi guys,

I'm looking into this at the moment, but running into problems with cross browser support... Particularly Safari 4, which is completely galling because I always thought their fixed positioning was very good. The issue I'm having at the moment is fixed in Webkit's nightly, but that's not much use. There is also a bug which isn't fixed - about to be filed.

So a fairly big update to FixedHeader is in progress, and I want to release it along side DataTables 1.6.0, but it's proving to be an exercise in frustration just now.

Regards,
Allan

jnthnlstr

Allan, thanks for your efforts. I'll be upgrading to 1.6 as soon as you ship it. Good luck ironing out the last bugs!

I think maybe you could get by using position:absolute for Safari 4 until they fix the bug?


J.

allan

Yup - I think I will be resorting to using position:absolute for IE6 and Safari4 (how wrong is that...). Safari 4 is fast enough that the positioning of an "absolute" element like this is very smooth, unlike Firefox and IE in which is can be a bit jumpy when scrolling. So not a great position to be in, but at least it should be as simple as grouping Webkit below a certain build number into the IE6 group since the code is already there (well - it will be once I've written it :-) ).

Regards,
Allan

william_rubio

hi, jnthnlstr

I also want to make a horizontally scrollable table, I mean I have 10 columns,
with 5 columns first shown, then I want to scroll to show the next 5 columns,
can suggest your way to make it?

thanks
William