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 03764557240733696222248159152605232309431483416290810431334537731573920472633025139750580857141447167232543475251414754383014371935107095940399062425444222371756921637625734297123890890
Row 147271192295477999574292411662066527141621347083430393222184139387120847624154429247910666310383930363104472939251831592139541307920369522302085576115012501597420859303905242640681775
Row 22633283021901061530822961126241031344162551418632087134517834026512703373448814787349438112883467589121713723015528531465647211453367071421163118333831476559943345628208046892410211913405113
Row 35853221389933476025186814119140321854205568853313851180146664558322229739110535061384439856882464308620984583442612104436464651091782524742952596438469747804642438441112492185277610503407
Row 43073144044592134182428561822428859423919287143685129130630134238308822602532568326971229446213395613257238315797534848803203242132016624554214445183754314459429433012827342346075840166016942099
Row 541921377479654205839134503224113964482917582844203141793163369227325306220931075737668140030383495482316453334483333854334674471542284094455343623125963232619542721516939848992332167636311638
Row 63885737137445532137441220479595653801442339448131152108304042086601402133316223727328643422896127052415227294528718658303608223853825744649142970370480921444097562122592052661466864
Row 74062179924851789508482746853546739113298293747754128545101335102881662493899123665747313546353685393667202858591530901657401518797414842563109449084474439218453249251923894262282677
Row 85923496636672289471380127514080193341810852494819817082962207624481803263935427111113193325554361445149442623447916202545344552874834215787158523728050023443313949542203991126184487
Row 9271452562028342436839605979472924114922135189054238964334582827304915915431472719533151071526126316122564217442291051488734853078231038531037228925813448121139324337175218282671158045573161
Row 1014942870388816891844958221414475704778362047985828250722832905481713539421105271613902315648572640672475239656461032555711403901344428284085240250425532297138193152176936475658405155244754186
Row 114493557990158831894154856085961402320045607505415617462954500435741039140626155704377433372114540793379419646301853238231231432328230053326483026133286285246172892190617836384860518212115898
Row 12587382546849634257418951082336156833039663420568440894852296610942177179637075463464823232354553250059915413168112015310226850265778123032833967338561855343640584295433244672180529057653981
Row 132085347134437335794579712862294578869839759898242145785147232963751180929143285544934972382773216920423063193423514854053466588051993263116514923050186254674039186957084052165411801348
Row 145405298942612689243717582926521039274968227258614990141952652456129844635718246259552768432454218061935129485718463092051251329744663939573322486549434150583212144010482226323275127739291738
Row 159953911692376247151113456749072413424753549362920033846209459423579231780625214676383734447654593651751736429434881731468551805492339929240592306533148330581082511150614927120550032505
Row 1635215809502539874462759246359053123421364114171701237110188018633500117159225805170414052863278551619241711172092642165240735324132271180599956891085312239021725453856024096463848259592137
Row 17165258801942335612854804140180072718513519165367275923873307598535673305567446524263575376496331774472360136584430573853104310167926655595483280513941210465549132862472116715249202716562815
Row 185332133014665758490418424720208131423215738474420595047305437371712264842194516404254293170295422901891462515393918281435432491610581930075141661172725941975404723327181051379377238423090420
Row 19206116064461148947761415377966640531745843203670183319303489483924445150565503711244611136918424716274756142558583733461814434493106218590838858845947320154672678711299219643591374639
Row 20350970236764632531350454744028179288585162812052033071461353093288452031934171446739436374733126449369285622507355673130577432431762508622872236311440782323369957062443290127761056220964
Row 215575540242344041579518712774105880637026805879326838105652511557247382797180818518754131555058057324503356162846593419120340601653524438553523201749124329571855924207298634013858349729722596
Row 22293477944461168290939951748348244551035110510425223123164417455561018169715735930251291552142314277292120891773589346842065467231303233158111254980506215704083417267360444843836477840394854
Row 23474561147834999024303473051781224819950111755023015578826322471369375652264315326330846025998391230853833268911242686316373514693662163657712391813995320917632111271147771899534350243267
Row 2430994250369824241557229924215469538425421585072940532112414408298228774179537236905173258154521284529142293183463332524501732150141474155305844657525275829828468433637674004157621759864453
Row 253533572142552629381594809222858223992861307444412593457425887471632303313214158286121492842319659168464772209018313225244321885366196851259602777135378176822143855520848062429179555524060
Row 2648278732218168830225060488429375905365550271735879147039232453437304712042134399198598061258401885418226819834969327810584125452497286216041380579915095035482632445914295116615937314212
Row 27136339442611334749233223318651112640545410931609578119021449232543994311392957784110543748132936268047273230384548859612057247490446683594382718907802937453023340301381359311587233843295898
Row 282664107400757022920942238216464172227530513222837774036951437018622840515047991369538228281507539427583093173110872990199751939971699211319384080375810943064288524158950643276153934345138
Row 2943792584393657481965763125413593521434630904607133550863800233278459124269486336694378316919573619375810218945297445531367610383967342330024729467643602249302114498564356535465568713184566
Row 3049561812235333433504191953110852121846404366618774079470358441501170545721776582131981514167715542048331224133654897119735461132453089553235482200245341328240621993205485902304819862606
Row 311620216226702441535941834117913230444831533595334443491141447528792035379723614037233036894434529893927543039412912203555615073470520014432288711853443117456524967121909845185238337233887
Row 3241808319235103771236650394664329244682605203503216652765207416737082094428430515210284955475921475739117725140411356583320419615813829196739462867631123813353235144118375401716104435674424
Row 33313718501474234646991020226734551411403925955524369759143719527737435686322361031644611944355159013781295261748245185040196123685144307106615335734521294446111115246723071028186158447715872
Row 344807538018732681323373831685104689378539271207282558883574333841944639487147663159181433774274428156845302446612684072433775345145243342477422625103877295142941804415711191691173144565884369
Row 35332746503528514120271801342117101103188629785174223305226244747393139810089035274395951971078211531527693845477126534214209713021742123733293543465850384645543201638187665067442551254601840
Row 36520362111444785558219159358734959443846431612265274029134394197624119366335279581117612944399194236148411454582068019741821793452574039841044561229435482425545542134499414675279701708
Row 37246316039863043277922801441472126402811742460960214826422753259923827363642199336793124248223252575242369857842125405224618153915288459326717283314531110093488177019695635441247212233793
Row 385457587527863135299830335367225522753064203924862469428443002860357228935530430020748405308369461012763328502259975560581454535435259925872432563219534687190750177264392148650092692434625815585
Row 3938758805791271518834843325146381123461460371215991258054758349922374390545292429644691649468759556581379430032389632175411775348894304423622135767504745581227541871721385223547556371460
Row 40386450892383415935584032284635124689422418111927518739854459392874434841755086411532223644534126404361147918623835111533211699204570458583761373627031272242592730834351113106843945239412741
Row 41422730278551448671196408750321674594928662789326945652992297344227537081125202531322051510714822164175587622164116261744211423472189018133667597684453405924371021293193227451201666955872
Row 42873182018964005387010035487341177536222505293197926914345450458122473117455730902457448180045851673307337051839376835772711558754737163457475202349116525564574094415422431137899210113624
Row 4341095567714565404715135150572045862855155823544314269194059034984539737851852887203047482627297429050574352128267197553905634268959553681420251043400278819584957514123893225108122922209477
Row 442669139333644699141599016724315047231712511419981101474746871055242728881595827567521174783481645062008589679742173733466561037372164575137263835181277338581892188658552993633454240483059
Row 45142942072886110432416695919482936765815562518931883090150239245254125216503088143244229463324307801317940534243643999771257088418742893255217931722228160813462120179544363621571936894872
Row 46136877730457891722362896252339441035186423075033263448775917450817702468300349126951908483748143702327224343421961130647881737161045773459523746735981318057081845548647414478436346572985133
Row 47112432853623381851932460263128945731506531569237151022429198036785887121623515868439520581712388179819022445454317423765784595999439556512458102625452189912859288046119615308244056385195
Row 483656198950622051404677459324843963217542974137455048744595454932694246100642957913194438536497448455610538112855248457649411236363799152814411922412453733097242135091647129421041954563350
Row 49120028571140439412414789446786439838481371364524233114880601302416144702224228438435320470413529665998345511604561380523601417494475426583733522127442130306941155775549244254655555157272815

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.