sScrollY not working with hidden wrapper table in JQueryUI after data added with fnAddData

drmdwebb

I'm using DataTables inside a div in a JQueryUI tab. I initialize the table thusly:

[code]

var myTable;

$(document).ready(function()
{
myTable = $( "#mytable" ).dataTable({
"sScrollY": "200px",
"bRetrieve": true
});
});
[/code]

The user clicks a link in my div to get the data to add to the table:

[code]



Get data







Column1Column2Column3









[/code]

The function to get the data is:

[code]

get_mytable = function()
{
/* fill in data variable here */
var args = { type:"POST", dataType: 'json', url:"myscript.py", data:data, success: addToMyTable };
$.ajax( args );
return false;
};
[/code]

And the function to add to the table is:

[code]
function addToMyTable( response )
{
myTable.fnClearTable();
$.each( response.mydata, function( i, mydata )
{
myTable.fnAddData([
mydata.col1,
mydata.col2,
mydata.col3
]);
});
$("#mywrapper").show();
};
[/code]

It all works fine. The table is hidden when the page loads. The user clicks the link and the table populates with data and is shown. However, I've tried adding a few parameters to the table creation in the document ready function, but they don't seem to work. In the example above, I've tried setting the scroll height to 200px, but the table is longer than 200 px and the header scrolls up the page as the user scrolls. Also, I tried setting "sClass": "center" for some of the columns, and that didn't work either.

I'm new to DataTables; what am I doing wrong?

drmdwebb

Solved my own problem. I had this in the auto-build-script-header to my individual code files:

[code]
$(document).ready(function()
{
oTable = $('.dataTable').dataTable(
{
"bJQueryUI": true,
"sPaginationType": "full_numbers",
"bPaginate": false
});
});
[/code]

It was overriding any attempts to modify other tables on individual pages ...