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 029621649400411130173054577511454979403337346404046695763709251847131909208681146492584353629104955885534641221349141602386153145712878236754872022134635192395598539233063561163255805274
Row 135401666842189425036195099429932075652293954194565454132803879425341572453739179159112582573157651805636213681252161409435188114935395130511156383428231752893671736385449075016173231603173
Row 21977898335135672155592451421335556012782146477526864975655417810364785328967322135606596125791341381514863575546464635291522554388050891698804423130333635508517951372194567547923717103577
Row 336591382578932651343236846065157385349624703249824902252041336953133739417235447724535305159503672524456242463561533340327417155828538305821955143221448410491725465941141458639634542325
Row 42134399730966691048304543402922669803590630028423180471666937171773286428603987291196449035456155744404255194973661653449334622321554050766058313175146357371762304291648922973633665
Row 5583634924651274744553554220211359724355304094609118225864070350321264576416219561751562516931926192846088174901524114814737273213214831187368636841198128339277275376453519091961260554114087
Row 61181357343293131971735485751253435673402555831154276123151286424435014971192746992535854542556284389133315899937445676217343165718510415121452396063717953633466213774786142336927156661192
Row 750421593589052941446531549225834648511826139118629995706590321031218135562185431493694516452624801938221725511603340815923196329888646412612580744743259317530046505032299435540544015573
Row 817594463142749082157194234334636387956491187548230572779267735436641318296634715791225378750914874428913893229469457892801453425242275360408169279250444048244023035305496300920758506721524
Row 92815414213153040192940519132181793514249121582194253645834169472324133815155285438539545514191434502523212133003194364411513364958315432655362506734821155420823932737150175725703194792811
Row 10656199320955040594716099543397413130746971325718811266056763965592450373031340619212395799292913881555549817062033230923624026440314023973112356136941415430206654651472876212558228402049
Row 11485938715454505151095252197949780614772203283937854564864218759654836219723202053381749227058031896514619271717598639765763856342956262965268116043462348630815664324865422811883052419224
Row 12524951222855862261249853894156164313155873162952904485485271974244953991678591128854758557432095623380243962674199444201922250546481508476611458962921278822112794441615013242390042193315349
Row 133618499326050237515834371033733635210646562852519682133517234758983164370381931045806121520208038545420298116957693915161284416391158612126128334964231132931234755329652553926770152
Row 1442425139397113455718458228651798243622842095360420521037642080442616751940551295854354782428625583536158218121462235119645703149059351048120845173912300595219651004555224851092319432735353994
Row 15267408695157022867523722594028184071186331693515664658596926135866448552528705436720197039912967107830912944613430215602698525312615564448935195966530615891829247416243394113215927997
Row 1676531386755121251583635024218914381155115526211210702224136423301788585358491754515814383582163230619762764465298237614728151316284239276314631741980237755514901903166315604127302738905914
Row 17287937381667203751765248366822362244328881205419256162717581938545480128255954603658514595055618072509368738333983600712413652672748331145144155547473784743459425038492659485639032138
Row 1813834972597379526423546335634495510421282453464219934588390847401899242251551445115911879110050391928375938955831589640323328249318275969395182341894223469954648656915134277254311032
Row 1951944585247735245864356145236242845210151811451065549344115991375341016375578271731780552522765644216140924165646244116094231491819602816327334124403556262119573670172715061111332528814521
Row 2049623437534869242164872296838605088437727547338171883296357353843577930071254218563387521754233560236805343292656038631888399632102580221220825547711169392434559024740222828654474702643
Row 21148113242861204451995035276480027145618172632743481361412696911933481277357403551394136633895384324031237088771923350235715162114401714524546765514195942941239523217754852501246550453981
Row 2252374785153231782447542710204850554917275726574050772083125652884831969453351591483491345227215723522615732241691617420592754015736410418485162512469747108514234450592825065705521629891674
Row 23374821473156423955995877396248251449418551520662389144214662125554633131286467040105996552044324445544893741504663392558242410722980649567128574610449543052794501037051834511836130759965148
Row 2425934665315825894185158910333633252651832295451500747055231987535319348433963468731487573696351859394146535312464142450138392807165942799132481460462357736439182245650562374616364976938
Row 25479293856243627369433201144363314664974879560849982718241465631453405390346042028367652472945389948962568464453215435582101044805206463721742525578058073991277468635985274140312593045483416
Row 2638333152544315082398238854071294495540501825497363228354977283714711151536212519573353152756439508011046961731559343764563274438197151412065477434516035272259565611585094463339955645783
Row 273356181574070833423821658414314272619487310209943435376348133506290450182982333841775085597383316654690246556595253224730151068298737234409336853802551479519981423581429924858357718042363480
Row 2882253443818499858513414283115162103529611751356154341892423452919118311897129033816913288480450527936614081208324456129045368237819025218579247337341894402819083249557097567140982007502
Row 295995329738826855842685119086334652702946369383158495736209175149546000483568818944511159551424080169148132178369853142172995319628571578588140462441226331653865951147523533013559865284
Row 3013551468497132485979565239040582256120323659545172407948371252642526359333094966381862543524412177135874742312545724025447940299517271835604117407658165319431157695835718717354759813242
Row 31114032892208495739135593369568341462111280827171351287275731303014277469011308495064485159274283587799138305857423249693146439392610599981295742514334053549185935404836461667018491389
Row 3213592978223818643426139721383708127331281537112913605064274179844315333279557267419383130362337976692458241213394306380026971284374561470914346992416270638273953383451864459210898328891440
Row 33377826151514571557445136351141315935923175158993722444811823759300858915192370723061898153325957317184717183917001606327954784220479251933964392827044376552126261275419348457460141071582491
Row 3432995288279751968203056492715371772766323733784044271515982836190755617634610393728312364063570215832637303569042187942988350635902183432564611105862241718753098579559195813139227541719953
Row 35351732948893800156429523502314755883804283638054597582313112187200656352832311654965249499025945044490824064361662412513885178445327629781732284793163281542835998620288058211930506618271565
Row 361898494210611147393236541902840606254501418520133679263722896562654551611355816233054175814295022965634488013621461444325940315044406433451584596117352175220567334011233335238352140082691
Row 3730365142250753664558232023158541954119422153414163854743817314138792150229824753322151516952995491629273474953447435416443482349641502847205447051622907242435651225838199345953654513324745803
Row 381431494831252945642120186035684668134014481924561496231460643434367107635041274349938593953336585149909894984146379241441139163358105340355218462145013026343320248641305634309224724001
Row 39416759765274166638345669500236854658599126691207823082531469844015832733565720312335686283745532171967418652623438218634293413145950951247112740964932578540861600590548684681435356551202017
Row 40298477722201531446250578363323426858953460453332487319122418211930395131050282345982650272734651330316210304505179132752261398285836884542940432047712074214393616601537480935723954928
Row 416114467197834343065462716153059563322155940625002886563138985743331943522682163848283889585227645549138915723120534224993731380944771164873310313251402305946462961346411465846309550445589413
Row 423395227120512223159190249865708329055828282632305755844015331722131246353046271416941691567451572837551922521880510826645275137847141497153661648312443905104140715364097462897656303502288
Row 43426533955001595850864674511419234193136638023300402930764677274345732133358505514561263955527179941924154277438214504506220851898406220439842736115729069282522708422755137842904329323563116
Row 4465114114572191415064098371256982252486351975555475603265336091646363734428025431271532312505498587350332401316613895517381728004088573043062186344240034437392715215192347411241845108327695481
Row 4514265570232697489212722195476430545951930169441125746449322005475279843852916800282184323212013431734443857539921233378255782335935214673463157153437493643105366629242151115121462045861919
Row 46300415022719582523445039183866124835694592695303088324763894404114950204119458639552428395245844849306337053469164856234723149234229754931381213415338631828212558485810943034524754984182
Row 47426636162768222144719804489237814508236054284131283225774723129206918525263222257151090243327359473527330651933024148834596394255567968249734835574275449901933218231204764475835921893827
Row 4854441155304851592244548054312191300627361384304223484266824784521135014505003923420339932856384111316205142470435125968414846663016330691024952737310055015472448455313695332619817218461548
Row 491622848247158254841532620959539455350465744575318280431222333110403148282846113143292318561538591229404056184478556041805563320751630447314001838442623451187308280150458853923283659941954

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.