olifolkerd / tabulator

Interactive Tables and Data Grids for JavaScript
http://tabulator.info
MIT License
6.75k stars 818 forks source link

Fixed header #1402

Closed Ibra1994 closed 6 years ago

Ibra1994 commented 6 years ago

How to freeze header?

olifolkerd commented 6 years ago

The header is frozen at the top of the table by default, the only occasion it isnt is if you have disabled the Virtual DOM.

In order to use the virtual DOM the table must have a height set on it.

Full information on this can be found in the Quick Start Guide

I hope that helps,

Cheers

Oli :)

Rapster commented 4 years ago

Would it be possible to have a fixed header and column headers without table scroll but with page scroll? As an example: https://datatables.net/extensions/fixedheader/examples/options/columnFiltering.html

olifolkerd commented 4 years ago

@Rapster if you set the virtualDOM option to false in the table setup it will not scroll

formtapez commented 3 years ago

@Rapster Edit your .css file and remove "overflow: hidden;" from ".tabulator".

Additionaly add: position: sticky; top: 0px; to ".tabulator .tabulator-header".

re-hopo commented 11 months ago
.tabulator .tabulator-header {
    position: sticky;
    top: 0;
    z-index:9
}
.tabulator{
    overflow: unset;
}