Skip to content

TeachBoost/fixed-table-rows-cols

 
 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

27 Commits
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Overview

fixedTableRC is a jQuery plug-in for converting a well formatted HTML table to a scrollable table with fixed table header and columns. This is a light weight plugin for rendering HTML table to an scrollable table the fixed header and configurable number of fixed columns.

DEMO:

http://meetselva.github.com/fixed-table-rows-cols/

What is a scrollable table?

A scrollable table is nothing but a simple HTML table with scrollbars. We can create a scrollable table by placing the html table inside a container div (see below table) and style the div with fixed height say height: 300px and overflow:auto. Now The table content is intact and We can use scroller to view the entire table.

The issue with the scrollable table is that when you scroll vertically, the header would scroll top hiding from the view and when scrolling horizontally, the columns in left would scroll left hiding from the view.

The goal of fixedTableRC plugin is to create a scrollable table with fixed header and fixed columns while scrolling horizontally and vertically.

The original idea is from question on SO Large Dynamic Table with Fixed Rows and Fixed Columns. The first version of Fixed Table RC was neat but it had some limitations such as nested div structures, breaks on well formatted table and the hanging scrollbars.

Packages

No packages published

Languages

  • HTML 81.1%
  • JavaScript 17.5%
  • CSS 1.4%