How can I hide my table until it is rendered?

brianfidler

I have a table at this URL: http://waldronsfarm.com/index.php/products/

My issue is that it is displaying before all the DataTables processing has occurred. I set bProcessing to True in hopes that it would display a "Processing" message while DataTables renders it but that isn't happening.

How can I hide my table and display a "Processing" message until DataTables has fully rendered the table?

dcombs

I've found one way of doing this that works for my scenario.

If you have an element wrapping this area of your page (or your whole page if necessary), you can set the the style opacity to 0 and after the datatable function in your document.ready you can do a $('#').css('opacity',1); It hides the ugliness so long as the rest of your page dosen't suffer.

There really needs to be a way to parse display:none data without making the rest of the new dataTable suffer. From what I've seen, the display property is inherited into certain parts of the new table causing it to "break". Maybe we could strip that property after the creation and get the desired result.

GregP

You could also take dcombs' idea in a lateral direction: instead of changing the opacity to 1 in the document.ready function, you could do it in the fnDrawCallback. The net result will probably be visually the same, so it's really just a matter of which 'flow' suits your visualization process better.