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 051348849952391341827963048615332164122112430268931565859299133204154133613704710117154731233242737614833959447852317592194499416448385398170046352950439340411960665528737543711885298782
Row 129025198207715724068293798454264344103276022222718364032295503475358813907388756475128316439553433580945524914528348462694127323633298254942674573392947948632238483753528413304564016093720
Row 2837284520312419214136540849894805960815128816932194023182230594681565518593603586489136979594141320623119411604030478717952927391759752240393923082595170719904120217038822724932284899
Row 334723532028539554925988328546161109166557148877262372116240703963904362739525145230726134045174459881599560554234050274128271028572428623422296126435414685342973513022851191588427681760328
Row 441501630523532029533782372926894887327204187515005194734843544713913261149129572242478752684121659272420449415691242523843145410512527773613227207470012333299899426042611205488018291843
Row 539224438918993167424887237145994431346214441224344813162412718023856112436534608174184552304892594726275433268514113065345579637073042077462628539673833182553832364442512518816284097
Row 6518410947388813542355359417413573317263002116316285267345156334986281931335252131059764302503952272676561318563969281573231434092538553293017351826694593146111721302443035583671437017364527
Row 772713721021225564034823973507027124094398317025814442018024625708186512592995395028994811224415152219141093275146811583919538152055815392329594457974468146241013979219718933381157352842587
Row 83602173153825884136582727620127932801112497681043484998492549154129327423112474743322250102063310524257235287164429722308515844753582548643413563088346355317934812333238985547529284
Row 954862071239116112491574564047964833310753784988396533631630482125435271391130736129841008115211234123429273838452801824605429820472953064146731652972169638081345398949363007577745117292486
Row 103504952437378053413794328444532526032942446225430229723550504759672047573188403452443773452487034524875677326715161898891235543505587575319633327148741703944130224644683998516215914255
Row 11285858204981483556672195143454411871980282053567332803199527401123275341823235598951072691374324359743961944589111424548188824361752380729481507924389801819109361536064311233593221703053
Row 1293714362761191216745701643443391216113758932161826885462106614602661165382944524632684419034674990415219355573342940911830378446025556277450215908317349626425315510833353453427416534482618
Row 1337944059585122422727335332993052367379614895212152239463100488718413275561745452637276129012632137197819304057333933512723437222011046553556307265493221025234807336233857852633575744473864
Row 145458598322944674981323749852633208257374107550724215728091545540711053633423527811478531954392854383722381053323334218738432194336763752632721781512245713271503285718643212290498235545859
Row 151190542744301539061711669478111063262285248133053704416449251558360510144606406747472021399014728657094762498317731248279744345059149345824906121432011023129856772212507919250564350645846
Row 168833281340611542390287512524393045452323045626376210781582532641038962257414845803582599749451223434155295226734824715433824555794385035972066179624645357401841193236506392029204896719874
Row 17389720584575245145246847415475542167820587065977387160920835015426224194945269206651183162329470011664369366851462126284918454558185543444441426643002905858240458885820349257545742635301
Row 18598352585824259640823498112457175299954488355441133371034385316211657534372331721051399218539711409812140713171949307726194564237055348923005110256343024223439833791981578720933818292225327
Row 19255248109167943743379452984644013758341115026271741198959543548917175443379149230212195453994207422915866276251154861366841673185075543025744444495859143537464139634763113438425685219
Row 205676167458002633536223885920673912186014275023923517826592206467496134803317526810172005335725142625316911263518515668108823704251468613655695650237996126012732898167014715642333921914952
Row 21210345045679528046691954633155719261164144533884596234725002055309850171312130211204879707542952396132476356326774735578535814674128041245336130413154812196123824372255107237301927510043574883
Row 2236943964111842204618167831653115226117921767759515066406168231934351111377159167135815872809933152210964027302011021448700245833485695475497151433973438251475164515535243217150154845881
Row 23547019057316294394297287443814304129543861435361651456583982204216576943108154685914431642362057498634785489550249501966190144252661897181774852761430649390922772938226353138649304550
Row 2435128188892273877190125408013065149918305142398312120244475536157783802301284179155853829603539133529962162518723925288361141921031010339532634592464534155753335294242331541374306312
Row 255467557648874813577250821792437117050162514625552538423992475624225881709147740455640482037673067138513035859585820435882172722027675376486811925621455355482864176742452365445210340362493720
Row 2654835203271357494135927160447222143448507138315847212524507529281432489686432844595994380458515530177480133122677436942563041445324625753180932375891946511921505747170049283433963534
Row 2747011692320454847953678279019691619544391357640351291193824885842495144355026167421881663671465221962228444850213559194439454284266044691774456023314813181517852142269273541593211399633262362
Row 2837333456544678327485735302762132655443405439959792446512817995756127224162688195247191429600549621874134430647452836498831024876397142845589433946123577452741681142136423012731511220341919646
Row 29282330450474426227325224321111542042248238291956838344702721103059714523184457204570299611864521335291562112254142807368514422413543657485494191288221423455497410331709922459432444135814
Row 3056991971445053915739399912151865583084742003426530716215493935921140440932953062114754152473455193943295647782532161210474719542423485788213147346355785188353643141229727823697596845163158
Row 317721631402037075253117276022184420298465185377217074865332526632036273418662521363213381877228137683978355617824140143845323273112831047023168384954833405252451251839398054775961309534441008
Row 321050429440135944538210237124827315356832382872564733457614425126224114353921288052585031283450762568442335234957319827237362892271353035158764314230531534197209112505531174276982058575057
Row 331645212130101098228920861845331253742791394620234198568017414764270776636845087921712471448538745426460053113998221139034205248842823445137313831381515136285080654416812357574108368642222455
Row 342496569211585547505135405728544654453180455048523643420129951194457921428832030282674359580116444171766575938053978261026212256765268341875712477971942358028964696319251454683473032955
Row 353820505247919444685542056371526583930341817411127754653324782324832453474303167426946754976459475354333361441022991943347385832255796423933808613290470435102838144324213551307419448711162
Row 36486429135197338839373919152251132597124330238172789520737471730514920739829520573595203507330416975414373159601966126030673434544826637954089435641225974210214335170364927675076158630123110
Row 3759377854424384394845235214264734022778206239344287120119852170325613473961119296025664462297431791169505762258594435447028865919312525871650532229135609578558805391429129041814662325948933261
Row 3843363272262526664353469645257635507276633794514456639473828413258444194138633873640426245945261177399277796811235211300831079544387426490410558408437919872102184310344866144940338505195
Row 391694185947794374942131756871923171338731769576517352273536295488454711597258937992366996355714752511189952184169345358085092278019334136161756588014539399750684042336892011485909252913011312
Row 4016642950614511469618664120852591765131958281933514744281698189922678771518212421544075189292324633804527148513674701679256542185990235424374551376910653663134726723684579364332734403415
Row 41462243611051007514821855217449011811129466529131560500327293801739330312692313560828171980302243726831191538865519514408552330992419411210062088120895734914012525253425983262668359147422451
Row 42128732642600155323014353649585226124986333930065411983308853825301365818591891591550512894340881050484030134549451975827120792945298222029164194171412694084329231252143480496914064715458
Row 43353525884639612669445347783385356203944051461664505646457574213207012964286402205225921693904985531382197548525434410022801995764231744844579458450861159143916353176589327854666122204
Row 44270558745128555910959471172221025031836103021635164558326626452313315889323122262346252821254468354485654055660449071412465708373041755774543818974608385237703188496035322825375484213
Row 4519641649533716595052578030225867669589659381821381922101895225211645502282358794551508028395224271028422819665550556293218541833306166046154886430338562385574011731912570227835296319649404403
Row 4627001162140845895725217314728245299557039702426533242612548121951332288434525529952449395921151217292825313243493849164374986523240871351400136305587494444445727665556785433504907151212362609
Row 47637520014805855514952236112201146288350702287507119957322057192823255122197108944538498953770502918622779426235574844456577036265537954682166858209981879407490844393084935499057944275
Row 48406658013919324136768559512775593502055819968922300280456273390322335593281345540702073863506770940125318385352201553464582136351670545239241340198621314942252784541952035551231617965056
Row 496873627180810746263798742262686684446761167478742031947126230751387374639148706311785486409117745605227316616393173204633815930278321014712236150293165161197915369321132515200533661123

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.