Using DataTables to fix header columns and rows in HTML
Using DataTables to fix header columns and rows in HTML
So I tried to recreate functionality on Data Tables where the first column and first row of an HTML table are fixed. http://datatables.net/release-datatables/extras/FixedHeader/zIndexes.html
However, if you play with the example I coded up: http://joelin.org/work/Navigation/ , you'll see the leftmost column isn't formed correctly (the first element in the table header is too short).
What might be going on? The code is summarized below. I think the issue is that the height of the 's row in the left column isnt getting set while the height of the 's row in the left column is being set by the JS.
[code]
<!DOCTYPE html>
td,th
{
background-color:white;
border:black 1px solid;
}
$(document).ready(function () {
var myTable = $('#jsonDataTable').dataTable(
{
});
new FixedHeader(myTable, {"left": true, "zLeft": 105});
});
However, if you play with the example I coded up: http://joelin.org/work/Navigation/ , you'll see the leftmost column isn't formed correctly (the first element in the table header is too short).
What might be going on? The code is summarized below. I think the issue is that the height of the 's row in the left column isnt getting set while the height of the 's row in the left column is being set by the JS.
[code]
<!DOCTYPE html>
td,th
{
background-color:white;
border:black 1px solid;
}
$(document).ready(function () {
var myTable = $('#jsonDataTable').dataTable(
{
});
new FixedHeader(myTable, {"left": true, "zLeft": 105});
});
This discussion has been closed.