Locked Table Headers

This is a demo of javascript that allows you to lock the header row and column of an html table. By fixing the headers, it makes browsing through a large table easier. Tested in IE6+, FF2+, Safari3+. Fails in Opera. Using a separate sorter script for table sorting.

Scroll below the table for useable information.

Header
0
Header
1
Header
2
Header
3
Header
4
Header
5
Header
6
Header
7
Header
8
Header
9
Header
10
Header
11
Header
12
Header
13
Header
14
Header
15
Header
16
Header
17
Header
18
Header
19
Header
20
Header
21
Header
22
Header
23
Header
24
Header
25
Header
26
Header
27
Header
28
Header
29
Header
30
Header
31
Header
32
Header
33
Header
34
Header
35
Header
36
Header
37
Header
38
Header
39
Header
40
Header
41
Header
42
Header
43
Header
44
Header
45
Header
46
Header
47
Header
48
Header
49
Row 036644133366414315258104745123387405153902594537034585882201759064671131345174109497459961059241318545405919279149962618588547473373428552561453063188920862155125123248716843233191939535792476
Row 123281787201729151662307145212153318929722233172286157551523103429526144273303941675247336766327552055593750044599522132195935642035586825172836891560448211628333622103043412235111851901322
Row 2364265616341880439076615281254233251109943815504913232049555409535015564595338749702539192830812405571806551716131633353147945730515927501138239181726059703328520542321601192645906265604
Row 3548034344471648430315488483128354754445445919702418446913674329640825309732089212259257250191110713102334973348174727715322577210915595484112636143987126336031273432241013729555941615510
Row 482252372233517854472335330327041376511570501119467674951143391540158158482381244549091652249439822522397538924932384488159082404378457021430522834752100761487219716822108246120085424667
Row 5198012835961842514559244491287390680331232614586229844983169750703050399337551551794387536033949015303313038824864781461929443706316324213991297432794752726967312358362982481374175364
Row 6210724582091463819417434895554831405136372129416003853129435637807156981108191442421186428425912080382813355354345258632262335943328269427181185556439223495443432258212746214025481662001
Row 74135190434501587279228590924944156265420895119503310918714494431341036811234429380451902434514110375495276110521052821624389369248685744832002146249403657411440525964796460859131372218
Row 8473624213204207633672459147025285285473467523115285937563421251443608359359519871868337305329913414112332503686597116081621476545581294341715668455926771177431915412973975467715982972472
Row 99111512378527734515006456924541463106115414296480334324920774444501665520308154926143778376523211689168145181347109436601953620473810835636543420355630274326992444305046443767555514682
Row 10217758954683117513422711755637343953213469485437332330465045765473133928063406491625448320334588376138943660497220115087340421055002295051512007447347063126346526045300548138702360128040615396
Row 11345438217202667169923785966405792945542208302314902401549616813671369848575915109650252383489032852869413535415737112734991513970158725444981463248291449404836082440182636815731238721292903725
Row 12204922024688427126404684309013922431542227035043347040375898530913553649335333132518119048082747459533752248463115764115472555780726348621327459341572451104779515361641092372497024524285755
Row 1334517961332375946341335363130244092406471534824993209539444808594423612110415455041567689213856205496599035964899653555231539207715835347612202675913575217545030173001180499235658391106
Row 142645297243415947554803183399284233352841273158283871771341163131461240354476736863361929524451371368480941712624473256683767501518622532553581558524063201149895305303501885435571213
Row 1548413163564411293521615836323036849349913155055069112120268361423596511164714097449079836355458228333625811520046734774488959832143993179428743645408335212152506409475719135772732581
Row 165311203931684249434757003676439279226306313667299950654209578236602562106128834525353639986367146122115721725512349972430478250157045108118514822597554653723503854368362459885977201996
Row 179591627145871723434939222608431538065202606227517623505154271052693332510474035941086331220623717472725272660440552273314479149822465514049104607452066930343341286991943365449237934575932
Row 181814285729661676368050744558174345823011383014462428194287529894400208525842633557557191828239117415743593310452806503436422083819420428091307162848865227397429205987118020410643849343254854554
Row 1916882977525519149156051212917525730049351505281922926344411173255814461402653192725505238544137369913121176619671151976152910824843266614334975368410704875448659382493915444053198795
Row 2020345583279762384524185718911201048101300165957453766383134853418155517804490101243442653393568637191443312514935651146957501092319723643265246986540259925354480645721901419578328673468327
Row 212429502336841257593874621345842038223850792070789126521952146251918942433264536567458011449136055254353369414518997338541917266246383547215959604246161154545102311637282474380718505893110
Row 229851708433453905827289915227762702213419053735462387313643694191438719102166318171150791683466925962077911265231741322320793959449973454197656559030561131821357925083861566539841643805
Row 23156620453771159141511453555346521584094566740613856559446025822233408414254107461852543517340129404184108811735138139256138985698516422703081189910063132722802688147412754751221207635781758
Row 2419819713767132438377755403217178042171702946443523683233566913873641573595629551646142499256729191618744523186841243698459834174132241110954814302427031758181775359536212019380645325078
Row 25273325632393425543712053305482913843672796104245593236586439424962242154403803430229038144964281021672617225324503163875233275844683355840665872425162517835480495484027211403279322103802
Row 2671254822390262554448104365226435211141358213129772646504714519313902260863257071554325445783093136214028011515236849482958473561424727673335742240573120148041661110913913391540042025115
Row 2749922992526436293428221226874672307030979443462487114851469338420935801364833668632079270229353123211379711776405554218885330891822533828371017106411835304494456108859747081777473912251966
Row 285726310558455555355862396054845547366826214295489226033207521044623845438357237022205328723195932470821133945528091024964409271537054602273223054666526028591316248296250474919244438874779532
Row 29390041522908591215708773156392834523399522911622015123290576811104813282158664253142551034395460433562747934504753335726270054032988181958865331222418974933575623042259296114794617249458464485
Row 3042164835264414061009914578933705573371725105291539060533565291364633623165146820331876495747785796259649015955219590836115940364028835727499036402242510999410053142715405558531390598726835211
Row 3132874392119654821594130323641783310956687137232491824493635413295344912036137451723550393613754331227632165008566883425935396325819743990550329471303461844508873045595275663391622215933
Row 32201740342815046528216921326452451453937395344331766407750735964506353914825384478251455214331559741405542392338493427463320424245500159431751706101736813410258817075542177234313925335941525258
Row 33372914651575576422691748578776230684991595442163246464681225861045105449592385440035714666449213393856450916211295346554571143752255484124918625222896274115071395520213008231115478256723891
Row 34558437941013067495570946383228194223102365707577949631661307253423855371184569013243404338254089305457083398561037064993246624501774282438491838300551293889208445838999622478392629014661
Row 35525526382554285728372618923051345134236575373229845774953291584286657717171778657174059265885284333695445489625137685333311212849825668478478036582383308051711633198529052790526633482514
Row 363968116312802970322032592354331218355000586933181829231311853258426416016803187442243362346358320895769209534424680375709571753455644381453413249521771205634007031974209360041143732703694
Row 371792212225202999425642869131816470041313195598720701464202510619892190887362336012004940244310095037149554048163031922337912121058354016144932590728743742025416484046631037666164821674458
Row 3856971151203226303137565444753921240728621298112853734886454140671622414230129440781125440649552742518325832141458239748623557102247053719285152554231661482348597241559140361649463357891869
Row 3915233767204155414333956953247488451176634607533020699697627322408396423653851693118812885023217827571398196149695672337637549752596289431319943204480177656885871448849282524512854854829
Row 40598328713964246578683012801909828492490673143905485276831274157338449902951365342082667186124443254369027841399579229115370334016495531455555975132493327195762485629643345443069280138452868
Row 4116421564459229112236115843249171383946519816743842273920492465109195977954682118233173931151795552337645311511221614447513015422485386120851501633151521472723710530011693427899518746114207
Row 4222628145021314136264904455450426540693465165217132091338285956140614915128424372295476414294813399219913138205094099219531537847569410301489184547702265573146663401181434865366156734192395
Row 4331384666340955695021483915115966277804967209522415478380958765458460012799055598626373211224777875186390345565773208715514151892514215805619475328853753144637108931431782163445054243644
Row 44242356772902441159532955745659493215619942595365013084039375353560003350324246021295428734223081453334257234433494547416692335469832032520282719333786400819413339324691462508346093629642
Row 4550905821352731971459368755264656255076053893940574241153461309730293955444393351253289415135192661569450324343784269223867857512123536638622906501142921312359445048842359335732418523844346
Row 46396846223698135671424511734272325550912971931353626822663903389459982562361522763022511921503910316233499818102795685920402637692006633139730633276255614323594473812463740346140939914697
Row 4745965927398031044401112118724759217942154185569855952143270026133084579949572753605319257883043350250829503316187521359642381139146001701564421635203479451395324341066209854615472501735142426
Row 483605463651083773541212233944876361524296461159106728604316278521664789490114334753140452194138473738704422310444723842536034084243478972020374320129827743078342066913253485519365137851051359
Row 4917862078552139134352859470239348272764113937041922105920798213935748301652752868899403042185905217922492464581975914363179538374730203738393715742735249245912342227956784015582822453911

I wrote this script after searching for this functionality, and not finding many existing scripts that could fix both row and column headers, giving the feel of Excel's freeze panes. The scripts I could find were usually part of a bloated grid widget, and typically required definition of the table in JSON or XML, rather than working off of existing HTML markup.

This script works with an existing HTML table. It script assumes your table has one thead with one header tr, and one tbody with multiple tr's.

Useage:

var ts = new tablescroller(tableid,lockonload);
tableid is the ID of your table; lockonload is true/false of whether you want the table to autolock the headers on page load.

Public functions: ts.lock() Locks the headers ts.unlock() Unlocks the headers ts.toggle() Toggles locked/unlocked. Returns corresponding 1 or 0.

Download. This code is released under LGPL

This script has a lot of limitations, and I have to plans to expand it.

See here for another approach using three synced tables.