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 06204543542016132157855092294733753371949375226559635570316056056172878581730092351291414174978473836440672541442584134426872004295727071789204956535163238516012915504025642484219921683100
Row 150771984109142748981525405363515604810435957031393570223893396265950965184470747484346109134912601302912374423295079844140510639522832596024763236359540362045195337393438165512883343145223
Row 2173020397143634111431956234241123133665693104209197413725160480513321636204149265672408687934111523253435382355847276123723866731734197750503562172803722786589193027591961109015643293
Row 327263605221923981690309758083212563033465567477106193843428372672319588730275351667481320755267840792716376856438493324722262891493753232698214849534317155429149365337719863244089
Row 4872335146231037409959431792777402145074544366445145037910740192758466246241994501446673709444248161361221258011684300672503549231708313448653500391028862006245354952014901459125934161305
Row 51320204032983337061006477555222367986532240511286599330852081701218507252004128195712065802506172520693964298454855268430315242566463622303572341017515938439610723988568110651073588827651290
Row 64959196554179163171599734214896206613851879155065218130743218481753037892226105472762121264714302319057861895955107651471920493635090490348339852555486758634105551944117827364861481
Row 73525108715344251170836592965200984827512197803382613442722431914061812480848885797136337555660546732745703645945641125353456502658178513573174749336511651499556119675325905468936442310501
Row 82451119829738144952595632812225565939252234422250505768387117081552522820243012592318818002153515511253058384347685367434312195644640503255164595231317414254237397524755286374334699352945573
Row 9301755952165204139443185358251813753201128674215442504130618315368214777384825623030408553755053371427958514363357354241379316715881583456159069401079128141412364202256844868332858664034149
Row 104643425171016732335124611775705552510274068309745054472632038102948231944196959013224110226552465793113225735658153572143005785143159732120267711491825220121765892529726255339556046623674382
Row 11605233642833829244554830752238167956471895321436819529991798167511944751316943675349183459721151725531477753939125382287521953211532027422851557442159323452163529936474633209738133751
Row 1257151294693124626195527121727345699747151123846598923112853410324313595438739882016431814393650461750852282714289833128420264726253046444252374613783951449328884188315137801300400418823731
Row 1315992691718361445873157126332032241354539165138357852001164230317305808555547611854505396840732693111918523993512337341723721400234414335258959755985792283831433708197672029083139302246372947
Row 1435764112413120812079220347743198405527672320178844893041579019301375237925279732170536541155877134048342784447918561420142554325532555615121611175928648085814305211271602154141681391347155423770
Row 15599751559395362462958157013463259951805318401960547493550160261516019195463968173235985094333351383261472426092803249326063318243119671946224626685408484518474726286324523474413261237345573
Row 16453042803541261187726343594101558952317362326984809228151240219519613486486213692330709945193316035685606577113015179430055802719456114575353215524715248447194194532803221960452025163921
Row 1720051377529043352086538335275245295031335016425123113316383150301877528743824031175836292502185255745781217315344300468854543056547444639215141262166139510765298411532716093727315763856032444
Row 185019363342022648134532221591522253754421591332084519978195131573128775323452311534620493347922926593636866226280588558954281253228433447525943559250641571472571426752449166458325576
Row 19174151544099289337743032337240035691100848681952108747521846536812841874370235181642602541597257312254264721803918247817565658163258542551540628855923340825769302276452720171027373138523112246
Row 2050862346406133464886403330771140679525750583157101247154788866126641933750118816003262118387648524134490352245519121314704605355855311950244435635027358342424283264013985294135518515926214378
Row 21390938085978423559263853308640592755231035783967378021821524331041313968873315815505114144141905117345545696893216550734802597250503036589729021223956565624321533362321137145147352118453114
Row 22439350034664350644328534017117723974712207045613784872453328333908443057354029238653914613919301367116332159419234775273258424803936902922789410640993185281716817466011039279343449464708
Row 233168297510942559343650125571410764417302298412110034881600493849703522572630761620291158921788465649328264934392617723642109447474735365221823746322228843894952258625095954146631094892436630
Row 244617351122501527340340371833895863511718202635275829131382149356535635238378738513627273843713526921902324415842338387320058491221727325141591910114650211026296616563784587930375276443600
Row 25451342294450213996748862274365978855175242312633905442297435121169224167030781370691410443352346188742135382116346565981567528844431181438513317408815094105360575012309951914203450613594427
Row 26176443757968662540413132124427234425935589999257452643883100510781733432151653241242527703991365437644182185722695540283244439777833105164209521494255231144530155056883793543369248701165
Row 27501240354406143780423975090456857894683611812293280409413075904609551511103551664224208116163911587410484602474422133614277861850503582301541402149359250862985370931426518031621854412
Row 281135196439621201187432816409859163864270046607631414386945363501937083503116813002588415350092902441781145225270122256571234518485714215226367355185142153622183801161225315238230518944257
Row 29135396542513121983357732048851994113134061264235230622497153639193917762159134355904312656523705473821822943104240751200105534716242367545442012687433819538171744145816948063955170527241871
Row 30246643145305236914404957741771138301612195213421522732684483946392137303913264753234514222184691531110232645101537464516348120603820585034992776592336753914293848933127115311665811599158051947
Row 31303011302421263272463949535582566115985973407113407754663933392629657093849639462378755321750193969815601929502350649581632592752201903456541731485422657712082163258831581098381640844062
Row 3245241932470131462718423348954657493045558554323960554310643887476329662452293544516772706532230925886903407404477414694927706169207334244402967208033321421266527635381220738273268969792
Row 335719390452433966095775270531974641113600523815792526594317484598336614955655446348198621102443674316407036345284486233533187410437493796387945399243425644591358021421116352238905714888
Row 344039527833315192642442176263075858324264424693161732292797536610246755818201550163816052596252317211174131434100444517121337597097637791732160645361563587045772551486180530518512828
Row 353725669484327411050544753363573116754533985260145724363313179324054288557141365893410756995762268359541247448730042098131572927671573470381656042806138877122595372337127151808683450842124970
Row 36407923484862218520464624486719995870335450031968466957324734482532022550442973937519922653309256949805116325234873328222215655675108437491721570726163719557759692722154446382453278346256542827
Row 371890566176410891926407236579053188909439151531305956189421337051910391932056283495289235050394926480253172388445621434278411629065366419783023946416539315337467910615292486852732996777
Row 38319233164056873604275557262529155650424917121185319441284090255941685067558251133232351244501910457337417783846737155510374052195917241656471314504185269491310128116752944408576528532576
Row 394832243416892063594613839724518387847502363461530434002666226351234321975572250512441063560615252738589959322502275225071333518541953395513043321367364822101161082441934093490268125321811
Row 40365631044316490041663921424903382035534055712862473757561056213248865388349825331598361325432422403159525912712248317224367558737326637533957369046561777404420602347905797210219612928988
Row 411349425352029474038635368206914527927802497100111462083103744125836499421014491770145551311710501347521930114274206436046993726130627363788674480438015953158429895327302380199011412216
Row 42984324270617543386125648704435260340891446876429558055575202011102311580817841115360917362698390626885427286467856825015661380932061414119544622845630106443721075194026668791515468619893825
Row 4344933772493921015507163672195106229287216302792532543859981946632446022292615524600133514633266221429771951420280244419735740254514791375255136742437284245454066563450773504563210234135
Row 4440913251439636143851573150771117194420543067145285635112118259555359739702605127040654475815447250804892197547125914110280231644506416101542365493213117915475198324440227082442997276338
Row 4549665368130853714814112238433894135818260559275927540730914432582341052668531623628478635433317052642141561226049035649522542709564596308420782439978209122563582201721832989510761528123211
Row 46328221273447128298928793298225350192909251339222558173721923513333527655912772253168150273835369712108242804182536351551065761346152342750339253250025358544115153280199832525472551135844747
Row 4751023564999782538228334479592365612822416129112961522105247567563801509532882803445327284317173247261568120342375152594933385507494841194889178125985481543738791896727517534181778393041745578
Row 483025146123811477418969832092915226544111151141743604488923330726075812508852045292452430831187525022574605102718627786053211423929854687242736821895534159473064921363466549792286197215862097
Row 49106079013885583387225754832128117958593143957463352421953448221046221130410539631076441044542438307534334724504750198201065808220756893679478145203806596043784119391648411642111228838524733

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.