bProcessing usage

strangenova

I have a large table that takes a bit to process in dataTables, so I was getting the 'flash' before the script would make it's rendering changes. I've set bProcessing to true, but nothing seems to happen as a result. Am I missing something in its usage?

Here's my initialization code:

$(document).ready(function() {
oTable = $('.datatable').dataTable({
"bProcessing":true,
"sPaginationType": "full_numbers",
"bSort": true,
"bInfo": false,
"bAutoWidth": false,
"bPaginate":false ,
"bJQueryUI":true,
"aaSorting":[[1,'asc']]
});
} );

allan

The usage looks correct. Who long is a 'while'? Also have you got styling on the processing element to make it nice and visible? My demo CSS have it not particularly intrusive. Failing that can you give us a link?

Allan

strangenova

Unfortunately the page is on an Intranet. With a table of around 2000 rows, it takes about two to three seconds before the end styles are applied (this also happens when I have multiple smaller tables that I'm loading into separate tabs). I haven't applied any additional styling - I'm using the css from the demo. I'm just not seeing anything at all in terms of an indicator. I've looked through your examples - is there one that I'm missing that demonstrates this in action with a large table (so I can see what I'm messing up on my end?)

Thanks for your help

allan

I think you've picked up a bug here - thanks for flagging it up! DataTables wasn't actually setting the processing indicator to visible during initialisation for non-Ajax source (client or server-side processing) data sources. I've just committed a small change for this to be correct, which you can grab from the 'nightly' download file on the downloads page: http://datatables.net/download/ .

One thing to note that I have seen before, it is possible that some browsers might not display this processing indicator until the rendering is complete - their attempt to stop the flash of unstyled content. Depending on your usage, this might or might not be an issue. I think the best approach is to try it and see!

Regards,
Allan

shamufish

On that note Allan, the nightly for Oct 17 has a small bug - the processing element displays correctly but appears 'behind' the table when off. It should be completely hidden, and not just have it's z order rearranged.

Cheers!

allan

Hi shamufish,

What should happen is that the processing element is "visibility: hidden" when not displayed. This appears to be working okay for me when used with my zero config example and bProcessing enabled. Is it not for you?

Regards,
Allan

shamufish

[code]Processing...[/code]

then

[code]

tasksTable = $(document).ready(function() {
$('#tasks').dataTable({
"bPaginate": false,
"bLengthChange": false,
"bProcessing": true,
"bStateSave": true,
"aaSorting": [[2,'asc'], [3,'desc']],
"sDom": 'lfritp',
"aoColumnDefs": [
{ "bSearchable": false, "aTargets": [ 0, 1, 2, 3, 4, 7, 8, 9, 10, 11, 12, 13] },
{ "bSortable": false, "aTargets": [ -1, -2, -3 ] }
]
});
} );
[/code]

the word 'processing' is visible behind the table and clearly visible when the table length is 0

allan

Interesting - is there any chance you can post a link to an example which is showing this please? I've just tried your initialisation code on my zero config example (with just the aTargets arrays altered) and it seems to be working as expected.

There isn't a Javascript error cropping up anywhere is there?

Allan

shamufish

There is, on load, but it doesn't seem to affect the behaviour of the table:

Uncaught TypeError: Object # has no method 'dispatchEvent'
fire:3000/javascripts/prototype.js?1287044563:5653
_methodized:3000/javascripts/prototype.js?1287044563:431
fireContentLoadedEvent

I thought it was safe to ignore. (because it's prototype throwing)

allan

It might be - but then it could be killing that Javascript "thread", if DataTables is done in that execution sequence. Can you give us a link?

Allan

strangenova

I downloaded the latest nightly and I'm afraid I'm still not seeing anything. I've segregated the table out of my web app completely, and I'm trying it solely with nothing but jquery, jqueryui, and your js/css. I've tried it in FF3.5, Chrome and IE and I'm still getting the 'flash'.

shamufish

Allan on my end I cannot post an example because the data in question is confidential to my company. I'm going to continue working on this and will report in this thread if I make progress. Cheers!

the6step

shamufish: you can always use something like jsbin.com, take your generated source and comb your confidential info out and put lorem ipsum or something similar in.

strangenova

So I tried this again on an older machine using IE (guaranteeing slow performance), and while I didn't see anything on the initial loading of the table, when doing a column sort a little 'Processing' popup was there. Is that what's supposed to be showing up before the initial table load?

shamufish

Hi everyone,

I've now got rid of the prototype error (by removing prototype). That didn't work still so I just load the zero config demo.

The issue with the persistent 'processing' message is still there. Both on the latest chrome and IE9 on win7, with no extension loaded and a clear jscript console post load on both.

I think the problem is not with the datatables code though, but with how you shoud set this up. Please correct me if i'm wrong, you're supposed to:

1) create a div container and put it anywhere on the page:
[code]Processing...[/code]

2) do this:
[code] $(document).ready(function() {
$('#example').dataTable({"bProcessing": true});

} );[/code]

Correct? Or am I missing something?

allan

Not quite - don't do step 1. DataTables will create that element for you automatically. Just do step 2.

Allan

shamufish

OK - so I have omitted step one.
Now the 'Processing' text box no longer persist when it shouldn't - which is good news.
And I know where the bug is the 174dev version! That's chrome latest (not beta), no extensions, no js errors, win7.

In a nutshell you can see it appear and disappear correctly as needed IF THE TABLE IS SMALL

But if the scrolling is disabled it will still try to center the message in the vertical middle of a large table... and of course the processing message is not visible to the user because vertically centered off screen.

I hope this helps.

strangenova

I ended up putting the table in a hidden container div and toggling the visibility after datatables finished its processing. It's not ideal, but it's much less jarring visually.