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 0675419666332175316295046424255133646840862276309379214043473531843491810230622353371777325072893707122558742362426236140954099465141554873318437814444027369834797950283735228451033708
Row 1597423772246549918421778463250825457500018872008337900452059811405651293123635305016168828851643254930352670549585947212450591738131435598915168472215132634293324443312942837185252522119
Row 2189857333232201163814205105418296475616637022009229449035246424352158338273029209029701760385518723259340638345106147257401939229105503378736165201240626601047841409229075477150916043222
Row 332173681394848821311362633122102472740411056984110196270624754633521402828565734539346631673783291223231439255522837588727352209413827362059320041213986383117743943037140057934815992609
Row 457557493496063618230910794042529659411514029823066518544482601223112441306529485349164844342171335287334952298147544085983121277307914146964218470040274445229252017554770567656753483
Row 52702513451045829184150945697391931584727470948412059198336432364464555153431173912765945409540534817274721975340584619443572321505257852303500584497344103950226026442553450755502963458345125470
Row 65901856931166626454885190122121649131675217623255445844184021183847975592368919233833304193541171452460449327639536112245947212853081463276936873113515118343512259110951625151330916093464
Row 72989123335317833365213233512979249045395860204031815444591311754486429339324074469542975747126623251832414597417895148732427910505273274434343435122617590833216000467454153063178770039341517
Row 848775693345224605044485240345722249377445994535338710965842784637700488715402449495542862408151783384574922253625248640715942184123705168453723538532464201132542911551762515449734352
Row 93600176314501919420947593299101836275042219716772710559317106293670280258743622196280734002216789454848751687266925918431860511194224602245929793011284149544973503521915928260239043071267
Row 109082014310897533933305368199233226374795328812854400133948263457175341503504587099484027834322885513830481020034745495747635319566412151824264746364032276418292307360948613641121815164502
Row 1131822732552954051256338740701441192113110772471290010922153014337433352954754918499567251493399156213035379589559289939034386388315092285365229082140591411491610597145849611240449939634053
Row 124428334415394854235323494362299720911295325337378657784585481413950455519246539401548534852821386265137571717436735506309403039933145952501700654960389915385231197444013923271238582266
Row 133175353429015619322330465539487658315083502847369945834833220549941834217452537733297555135203041644586019629892702273344184817982367552211394547217997910412811628220734094141348814463540
Row 141213171914702781404246031409299756783056418262156474352190958653254333712985702176539772370153440854362382641463760424313384033345311853776258786034388077723848150129529584035450916531530116
Row 153648547528644839378744822922217161548442117770343638101053081330217823245112426658011800406238024634546134761554135911475279659234574225124910984531362926663869231611684530196451744723668
Row 1655015004973536410224171171222831881667520231961818295856082769158441002885186726852386140713893241178340082711731593451429373863603414633217945669183056971316588445154298433515851546733272
Row 173515464107018863681794459453044391529328254215777159131202693330953095497513756075573165948887539861057438130393733206637803415391421937059189942109532317384837919438652523926398339102621
Row 185519358816121033350272353803575605493253521593646338517735015094424734663087473269018193763229229802036856109923235439546628284041598272939391409290422119921679384645355734165618954135
Row 19442394814453722290143425701560540895327585041373379351470648472267161433758633668185548343520434390359535664771284027032189216072153694733460534845899407638573697581745043283225488158661293
Row 202215489337070031164495161195049540531667559955632045786227031765635653269116142345909385409446371614561440342434392225197959115542792661420514664911843293132801725925420954005226867
Row 21331632924461548635733815445210331340189348635160293838685745286747205282292347595467221055314202466298650472645795317281464012537934743719535910946352680385253622016316913691086370537915123
Row 223551418539105343216158244042417021413973506412061909229329202192432586837944615154422197280256367012104395937225842261168845362543329856803596287739622657441471444958343185148258168171485
Row 2338773413123334630764110563115128239923580545726906695987478151731876538315104665217512637914668535417228453028345405584234575061346292487857058485145253919214868116837922562511856855981
Row 24228924694475637448327171728421116313181350343373982412620764283152378242241872153957983960291243744187313511064315495449035632575913473159329245374725200329115830532334637639421024196355554055
Row 252747282411902161467811334772583431631062857887110330923867308096932633710231530955215911492224448155780520514344061209537371103465229155204722321038446085277124215251604217170298549135396
Row 2643213392140818803026166757054851491455124115384248011758483635461647407844184143861507358613221338545536362051489555957873588587057854496443455123174523951215937262499430974258211335243114408
Row 27128737652485412059092158595016952911520227245555966414530171883386411752322932562072747731104385110557263513309547884128593689911449647145509170942262877337474963317634402841528423965329
Row 288828151843052423613996742731472142735723057135410261124129355221197327959025080742522939169019773964579149893657159836122811262787296026255124244448166804062122452267663872288914721086
Row 293536236020104838106425717911045208120137591373409250219435535455721564273422121363634348213441449524239811136180240917555373244855332445435745401410245299620205430151131012302746370244655038
Row 30500454645456386541131511153136727221724525553493659385661280034871797317119784053345852584854614304347411294443740975914205144823766426743375941641164755693810184776650205279520222055136274
Row 313518311049615209992559329671381807660465551481518378522975150141819443577389950112351378029685784453448768494568442321528845865996486581736864788167572513394427323550273688350621403255569
Row 32220543029531877295936201307291454715872940535548932881270244324834362725343052896540429273702456934033132469233791899433929744851192513124527071302393459636125994242039165360325850117294868
Row 332453194226124021855390520113580431427235969391635017534077144584324465910223711892077329250101412534813483280256120374478455557624282227641941127697198352381544957155252926855326217047731787
Row 3410122566566216072927113912484343065408120138181051450226428274791282500139752626545124675128617094046555921725920570731521074203921449342673438331513951757101055313845699293178438405749
Row 353720594527447563175917351371383813621457130232411998215251822425116059262452128261057043724248910782703131448710063255385741705998516921148993975117201854401171452109233135945702905981
Row 36185945525822002548132354573551259342232543050514955472625224732332551167245458695743813225313922419218949401655575325955662498337707594737277092555425384146944222698171250712601396136
Row 3741492842383233573493426223615066569491846801839276616322463459713155266242956292364511329305997480225229303713218544782803343276313121190768182634623281231812321203446356822881956416545362952
Row 3823445754530225580725425893110029553468528551632759293057172828587935915756284449814842529136221504426360949612132177140872777274554363955366453597057395055405650043969166339761927588214003900
Row 399241261346911459284618298157977324704122715549763772175420154726327627243406374835841051546073305431745690103137229671570164163246818283102214263518430421914341047991069198714813538949
Row 40306016943781822560729222337348411192604475510833114503454257555125184289018513659250544941411397730473114083533527849764441110112564615078127095042562655121053160580137193384304441511104
Row 41420524557855152350356424091020582210942931110429476104842190223031267390146812911142117215010792472920455592324397222683051488642436661013240330552661171254541889622411342931382650345302
Row 42308842315111328481158002778123958565944588653934219273037234326499431514451457768140119673359356739401284339116121752542837165754316025664545462749974766526155024383149506553574163433047282739
Row 43579530284734233648024975547638383409522438905735462119261666209831763671491541756988331321687244914103747189345853664120325763598102236472534801398058994131140613742407990320353903975634588
Row 44458312602894285555418945937405722591753105342784363356133995216249526712343249317142545013820578718241748215679941624748110585829225965126718402395141848211913288280317002100110719182303814
Row 4537286862495563558372474416513673244554226377573447483076414710445232301221106134574259159455459723239149452781332730190320792240583833562932181940731191254628341634530256365077559755961298
Row 4627482806475626326943131859895671295227621740281554440584677491215612695410588514836075388156742170235612981306186730633863531225994108343324251696389247701077471457061490460431443126529
Row 4741481570127350551316825563890202930631343482812562536688464557852665111418755176283259441461183240522265353619626995311473739471544345121625228414028735148212425592120434937494940499019713890
Row 482474470468010251447580260571660655554042910376332366835444113278629191871184424623763224216811774463046584222172933501703586831854349286234565681465238245903250324773937458637173751655691
Row 4941343496396594330973657528379441805952575035841257232549253346540548505169548259474124845224731096862293402434230196126044175131187544475515496120335698192240324361215544023038376228554528

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.