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 034413541086633588314549246834362112932653850255228280835363849316623636933437449259445713111507041111092545632644323580046175408432449986113555182522324842446307250362727388025725751046
Row 149351268448334261211419535372802306462957365569295155354186235859672684321913221866244138054311551328411038339354131612443843472879292017734090111553104369342039394104298988936391174324736053858
Row 2466492657242907273040342420557150715812498368342503330356211695103165122844413205703235141232692324017613866486536617249514291144738581021548027759145518855745233433729042795550620074445
Row 3178941944641492277025874184943482049495371337721446200352195303302346995579361432495667318724824004915276350920973720529825162184789528647704973529431181021578983047931234283240115375855
Row 4270911534685957578165524393784746171412932843543459053581618137946433883513937350513723726433416449591166417454951020883561044888395390514332783174588849924467273044265057208843435731
Row 543078646673934215723922267232113513433495846445213774552940221658452082549330181969448414854699290954178629529761516338117611831314391825743581239392510137334770546521095224240443255068
Row 64485381720864542301357051525210411059372161508614535542846163585647644209443650022133544957359024914184412613171685193580239851279256286484954075496295953441656204479711982889243120531653
Row 763948965527715938389367348512233379816824002990597038542692256703117563216575497618212118577230185007220250716602841556013145611549717033284434839351081451533540714484719233947091388
Row 8545543401553553033153373164730863916545288546213132128502126271739451843295022286622641031380259841735864331751245724704596729112575496226363011433312402017972600348231094727250357364661021
Row 940655488388632855915265292637635129242427537014946424161152023737837283148794148851675747433337845474835352059401855158454285740191150185005483727804133507810551833402352952444322530313281
Row 1056191014299062585217652393681650733888158919285471101616681382346722182814480552953868638331831623082543193362598210217911504468639667425054561581529411204274224112220441037932253
Row 115081401050663886330529334523623951605116528719671763238837573266107417234008128133748223068254115645479476059733271101350541281782939458630111462520831053066373339250332135578027895400854
Row 124511340898158482230404823883794352711483767798216028202079223757596645248122058712353428624357443318237755241071777377461751851357446514145405853520729322000297337294159579358073965551470
Row 1356447713411996505758417402375296112632481473816401098392229975562533524014144542533224141515306157213082868968859333861116303678260768642624346306012225609554159591249638388142452003216
Row 146456131757597730273272303835984579590545665438324251771067920178317535182128481240357374352362985499042425229518914575874580232135851282848528884255064279349914501354167556895559491320
Row 151367713153858144483899798347251412726615975901246238105751528942942639571433585431470418585465287014254192819274455428962875109227091358199135064830113135331490172834333951553731843239
Row 1638315822295211885252165630464717452644715136134412145690423940897819485446277244534276390319865765563054193716516626029542997242339064184167555621229391408756995526543191352153670500259964617
Row 1744482767307027236705055248729944732035465107511562461349750626455172462318735562271015725088214124854302581014864298442759331065149626561734551514320325024534514979850139573595556246012766
Row 184185474232889520461415303545305717284515401412715948507827662603811331717452843234010894340243815892296321151897279853361371512523034165403265194625610919614270137919093348414445114159
Row 191460256100238001345534123729331637269408425333067341939042192364913202731913326629871021522612562399113446045435645276220035900376358021244310339417747393082261127233745680517655653328495
Row 202296424037605282526129865381659411951412202376319024204366356644006490727674045308315054352534427771726502319521290235024463586590206286758503191340415081310254537105072444619132735411059181641
Row 2187739624723238223144066515840393088110953295438355529142737615780587695131841384226157295093133241751006406622859235707316148854430554211982495470052375583580945655021336314785047112412584923
Row 222075444230643354170539956662344404373246281327343917892111868133114094363306453945583852102966320168720134324194593539838712414732455663943989001043213055282369556813172580143526473989
Row 23579726764634374225143843707571445302719403747436544435860489431665416553315633165753693584329443260115955244694380635124490481214622322994598829382708451756577444991331051785850220323445266
Row 241736390755812311159954235254485858247783552438722892041486844354273186244221210456929388675313192841764491177837983410432115474162344253394636785197628245627485015474547893883317930615744
Row 251600427143134538513736264653313211622433691295032855805169039084230202939531908122545814363397235953107276014772855821122118844091553342132283158886540527431284231222341340363913432022655941
Row 262273417211658532534513744475640189759245924171711441808580867622283035383431143574310724218045329654583932424974210331821247275434720992808348354624485379470237110961613417890322894063937
Row 2712335191510322937603314255844143152579933875255298146345530132773223374809127847844188174811555283336053321855649573841215771325656313000101629445557542996535628165351233614494880366221811217
Row 2824713459600065852061155594025664871252214224424519853480387649844495820454139249153896739266231218851453893436836136318263611021103215159603597200110845811222553291795570432057784199
Row 294024531821224939321428615204344550484348133734164709170052425069272027458436803870258547643680481040935475451312972522712532055704834425827831694346222774218091564415851832633399558759833673
Row 30171366315422755242652221564519469677181549482789113545181622539313003315285415274057466330902214518135356134767336328549373998482716924244048325694227443332275716921203891209174232841508
Row 3150571383035311348001245327398147749402747813222516844810105133755234509963017518433962293235344082823374258234106525048794244228519923044240913181024288525837703697248254532507353328271740
Row 32263134571915447414194847200755005669574953233775499942012018128319250613692151084576176738534273424833067801781133251944113590443428855008328048924507294846413829723363920302740492222221800
Row 332613373118833189549757361462374530422241552531744760393676431938215771473571242773421435221064143199141358829133562682352640874564714358443002175132913414415854451531754789527836756105048
Row 348405321332542603673543124035663356632845753921596541002008452948145591282998991941695404177226842578561196129441701009378454914334204431633764444628261329173034015250169515011257223314848
Row 35305113021766122070535383903328240995864226426887340103759520653921296944983746429822711463547192226464804214429605651519542611417415496649544318224830524181247413205053483507842595365999
Row 361228503337445525526048903071118115361875332544951525252027562941293417221894125139704946543244326644859265344274314615342397049430863495575319755669343511244042582005396477847619053711482
Row 372798496244511744439348942010287758191353562012806943590177337801084152557551649245932654088717527020521494403029565204451257544166296314982558185635075435167548595054295455532644472633323727251
Row 383086537527103513463342656205514491936502470412321612223228851233720484697912264280265385333456075638597743332970370345835530781292406541471825553636367425241758583547474046495824662891
Row 39593636921170258937774504219534144480527383218351104385261402843580151198685856275445412379451243761125255833333591544832691282618585750595122205124723601257828555784168732935045208941354846
Row 40120750024701396135431080247319192204503052515795447725191076509523751354216442626071817100454611601269127536454779888549059855890419139453432527041853511474544746011268392411202344301834952478
Row 41123419215084305029244545465156141298529543922185478543772074297623225506224527394856371921853457498610945761329312620703807436039902890141091414356052727325355491949164140329699011155617495
Row 423360235553511078454028076346481383139217743453519813414422088154323553522160328822539571801516950965096158210471265335701067446475607281147104255419310129164552981623087138517055442
Row 43490733072323516042634123432833593219448635691931513911382998514257842604195244938591454594887179038911049487652762753431741825964033414322476316691680198115452493912529238690944341703513
Row 443864663437153132565257232011463061196422305855134604311715219441439491536133119896376623674807305827525715149229223227187715841597240848398544727598511605922406421754345009133455869532772
Row 4545004565589053952331225742025389500839168801929114327573513274051642351359438902335475338122741296932461749430328312702107513311267965726359732214927298522292843386541583985621167072457854020
Row 464317367535530701486309538473248444341156315465415289328123793618409359925453394582753871258398533721879565440961664367424135338402954828241123551955555967386011171513327440104324365316274733
Row 47125141722126107835583384506392952624716502592523901437263418918108615414366411507429617583020156957671343522213947547255652201155031235584612405248465328307657711717451233213454291119
Row 483674586517605181416035172200572932843543495046773618542242425818972136454011584541542469112491401726281002404947624305168243629592716164454444338164183172613593132403497625534644479435247
Row 494195510854222441181912457264629144505140733443672384336384598545820913041327427347674632340551693608595838122401348138195962589324130362607515334925252206619976595409566945013046426739595137

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.