Problem creating a static table

Problem creating a static table

PatriotPatriot Posts: 1Questions: 0Answers: 0
edited April 2012 in General
Hello, I've been trying since yesterday create a table with a fixed height, that will change on resize. I've read some threads with similar problems but I haven't managed to get a solution, I need that the table to have a fixed height so that when it load the content(ajax) and the content is bigger than tbody height it uses sScroolY and when it is smaller than the footer of the table it stays at the bottom of the page.

In my code I've tried to first calculate the height value for the table and then divide it by height of a row to obtain the number of rows to load from server. The problem appears when a row is larger than expected (28px).

My code:

[code]
var table = ($(window).height - 100 );
confDataTables(table, table/rowHeight);

// table
var table;
var table_set;
var rowHeight = 28; // problem when a row has a large text

// update table height
function updateTable(height){
if ( $('.dataTables_scrollBody').length > 0 ){
$('.dataTables_scrollBody').css({'height': "100px"});
table_set = table.fnSettings();
table_set.oScroll.sY = height;
table.fnDraw();
}
}

// create table
function confDataTables(height,nRows){
$(document).ready(function() {
table = $('#table').dataTable( {
"sScrollY": height,
"sScrollX": "150%",
"bAutoWidth": false,
"bProcessing": true,
"bServerSide": true,
"aoColumnDefs": [
{"bVisible": false, "aTargets": [ 0 ]}
],
"bScrollAutoCss": true,
"iDisplayLength" : nRows,
"bJQueryUI": true,
"sAjaxSource": "backend/manageVendas.php?action=get",
"fnDrawCallback": function(){
$('#table tbody tr').click(function() {
var aPos = oTable.fnGetPosition( this );
var aData = oTable.fnGetData( aPos );
document.location.href = "optMod.php?opt=modVenda&action=getInfo&id="+aData[0];
});

$('#table tbody tr').hover(function() {
$(this).css('cursor', 'pointer');
}, function() {
$(this).css('cursor', 'auto');
});
}
});
} );
}
[/code]
This discussion has been closed.