Scrollable DataGrid with Sorting - ExtremeExperts

Scrollable DataGrid with Sorting - ExtremeExperts

I am working on a project which uses a lot of datagrid, and yes, it's still based on .Net 1.1 framework. The annoying issue is the scrolling, all the headers are scrolled with the grid when the datagrid is scrolled. Asp.Net renders all the datagrid to one table, and it's not surprising that the header will be scrolled.

I found a solution here, but the issue is the aligning of the columns between the header tables and the content tables rendered by the grid.

I ends up writing some javascript code.


function AdjustTable(firstTableId, secondTableId)
{
if(document.getElementsByTagName)
{
var firstTable = document.getElementById(firstTableId);
var secondTable = document.getElementById(secondTableId);
if(firstTable!=null && secondTable!=null)
{
var firstTableRows = firstTable.getElementsByTagName("tr");
var secondTableRows=secondTable.getElementsByTagName("tr");
if(firstTableRows!=null && secondTableRows!=null)
{
if(firstTableRows.length>0 && secondTableRows.length>0)
{
if(firstTableRows[0].cells.length==secondTableRows[0].cells.length)
{
for(i = 0; i < secondTableRows[0].cells.length; i++)
{
secondTableRows[0].cells[i].style.width=firstTableRows[0].cells[i].clientWidth;
}
}
}
}
}//if(firstTable!=null && secondTable!=null)
}
}

This will loop through all the table cells in the first row for the second table, and set the width to be the same with the table cells in the first row of the first table.