1

Am not able to freeze the header while scrolling the table body.
I have used the followind code.

CSS USED :

THEAD TH{
    POSITION: relative; 
    Z-INDEX: 20; 
    TOP: expression(document.getElementById("tableData").scrollTop-1);  
}

jsp code :

<div id="tableData"
    style="position: absolute; width: 96%; height: 260px; z-index: 1; left: 20px; top: 230px; overflow: auto">

    <table id="summaryTable" border="0" cellspacing="1" cellpadding="2" bgcolor="#ebcaff" width='100%'>
        <thead>
            <tr>
                <th>aaaaa</th>
                <th>aaaaa</th>
                <th>aaaaa</th>
                <th>aaaaa</th>
            </tr>
        </thead>
        <tbody>                 
            <tr>                        
                <td>bbbbb</td>                  
                <td>bbbbb</td>
                <td>bbbbb</td>
                <td>bbbbb</td>
            </tr>               
        </tbody>
    </table>

</div>
Passerby
  • 9,715
  • 2
  • 33
  • 50

1 Answers1

1

You can use jqgrid for your purpose. There is an option to easily convert your html table into jqgrid by simply importing jqgrid plugin. http://trirand.com/blog/jqgrid/jqgrid.html in that New in Version 3.3 - HTML Table to Grid. That may help you to solve the issue as well you can do paging, sorting, search in table will be available by default.

Vinoth Krishnan
  • 2,925
  • 6
  • 29
  • 34