"Processing.." Wont appear

rikee8

Hello, i have the code
[code]
$("#myTable").dataTable({
"columnDefs": [
{
"targets": [ 1 ],
"visible": false,
"searchable": false
},
{
"targets": [ 0 ],
"searchable": false
}
],
"createdRow": function(row, data, index) {
//Some processing ....
}
});
[/code]

Later on i do, on a button click to refresh table with some custom url:
[code]
$("#myTable").DataTable().processing = true;
$("#myTable").DataTable().ajax
.url( 'urlToJsonData' )
.load();
[/code]

The data is reloaded and placed on table, but when the request is not finished i want the table to apear "Processing..." text. I think it would appear automatically when an ajax request is performed. But neither forcing with $("#myTable").DataTable().processing = true;.
What i'm doing wrong !?

Thanks.

allan

> $("#myTable").DataTable().processing

You can't do that. There is no `processing` property of the DataTable() instance, so all you are doing is setting a property that nothing reads. Was there something in the documentation that suggested you could do this? If so, can you point me to it so I can change it, as it is wrong.

If you want processing enable for the table you need to do it during initialisation.

Allan

rikee8

Hello Allan thanks for reply, i haven't been notified by gmail that you answered my question.
According to the documentation on http://next.datatables.net/reference/option/. I thought all options are accessible by using DataTable(). The 'ajax' option is in that list, and it is accessible.
At beginning was a bit hard to figure difference between dataTable() and DataTable(), i found the documentation later. Is a good idea to point this important documentation on the home of 1.10v.

So continuing to the problem, i tried to set
[code]
{
processing: true,
"bProcessing": true
}
[/code]

didn't show the processing state. At this point i can make another way to tell user that an ajax request is being performed indicating that he must wait.

I found another thing that look like a 'bug' hate this word:

[code]
{
"targets": [ 0 ],
"searchable": false,
"sortable": false
}
[/code]

When the table initialize and no default sorting, all the arrow shows no matter sortable option. It just a tip.

Again, thanks.

Henrique Otavio

allan

Hi,

Thanks for the information. Yes - the difference between `dataTable` and `DataTable` is important! I'll put that at the top of the upgrade notes.

Regarding the processing display - if you have a look at this example you will be able to see it working: http://next.datatables.net/examples/server_side/simple.html .

Can you link me to a test page showing it not working so I can debug it please?

Allan

rikee8

Hi,

I tried to build an example on live.datatables but can't find a way to perform via ajax, so i'm linking to the code pretty much like i'm doing. I'm building an Intranet its hosted on my computer for now.

I've tested defining the "ajax" property on initialization and the processing shows, but not all cases load the data on initialization.

In some cases i have:
1 - No ajax definition on initialization
2 - Just loading when some action is performed via [code]table.ajax.url('....').load()[/code] (A button clicked like the live example)

In this cases the "Loading..." and/or "Processing..." not show.

The example i've build is: http://live.datatables.net/wokagal/1/edit?html,js,output

Hope i had contributed with something to DataTables.

Many thanks.

allan

Looks like it should work to me. And with a small modification to use a valid Ajax source it does: http://live.datatables.net/wokagal/2/edit .

Allan

dynamiclynk

I had same issue and went this route.

 var table = $('#tblMyTable')
 .on('processing.dt', function (e, settings, processing) {
            if (processing) {
                if ($('#imgLoad').length == 0)
                    $(this).prepend('<img id="imgLoad" src="./Images/loading_icon.gif" alt="" />');
            }
            else
                $('#imgLoad').remove();
        })
        .DataTable({<options>});

dtimperman

Hi, I had the same issue and solved it with changing the z-index in css:
.dataTables_processing {
z-index: 1000;
}

rikee8

dtimperman, It worked well!! Many Thanks! As my datatables is inside a modal of jQueryUIDialog it may overlap the z-index of datatables processing. For who is using datatables in same way, the z-index works! Thanks.