processing text not appearing when using data: array, but does when making ajax call

processing text not appearing when using data: array, but does when making ajax call

quintiexxxquintiexxx Posts: 1Questions: 1Answers: 0
edited March 2022 in DataTables 1.9

I have two ways to load datatables:

1- initially by making an ajax call when building the datatables. in the servlet I call I then store the json array in a session managed bean so I do not have to read the database everytime I call the page.
2 - when the managed bean contains the json array I read the values from the into a js variable and use that as datasource

hereby I can reduce the time to collect the data from 9 to 2 seconds.

However in situation 2 I do not get the processing message, which I get when making the ajax call.

Is that suppose to be?

Can I force that message to appear in situation 2?

Below is a snippet of the code in situation 2:

function loadCustomers(id, sort, data) { //data contains the json array in string format
    console.log('loadCustomers()')
    $.growl({
        message: "loadCustomers()"
    });
    var element = $(document.getElementById(id));
    var table = element.DataTable();
    table.state.clear()
    table.destroy();
    var customersList = $.parseJSON(data);
    element.DataTable({
                retrieve: true,
                data: customersList,
                'stateSave': true,
                'language': {
                    'url': getLanguage(),
                    'loadingRecords': msgLoading,
                    'processing': 'DataTables is currently busy'
                },
                'processing': true,
                scrollY: 400,
                deferRender: true,
                scroller: true,
                scrollY: '50vh',
                scrollCollapse: true,
                'paging': max_rows,
                'responsive': false,
                'order': [
                    [1, 'asc']
                ],
                'columnDefs': [{
                    'targets': 1,
                    'render': $.fn.dataTable.render.ellipsis(dispEllipsis)
                }], ..... //rest of the code not of interest

Code for situation 1 is: (I thought you were gonna ask)

function initCustomers(id, sort) { //no data provided
    console.log('initCustomers')
    $.growl({
        message: "initCustomers()"
    });
    var element = $(document.getElementById(id));
    var table = element.DataTable();
    table.destroy();
    element.DataTable({
                'ajax': 'xsp/customers',
                'stateSave': true,
                'language': {
                    'url': getLanguage(),
                    'loadingRecords': msgLoading,
                    'processing': 'DataTables is currently busy'
                },
                'processing': true,
                scrollY: 400,
                deferRender: true,
                scroller: true,
                scrollY: '50vh',
                scrollCollapse: true,
                'paging': max_rows,
                'responsive': false,
                'order': [
                    [1, 'asc']
                ],
                'columnDefs': [{
                    'targets': 1,
                    'render': $.fn.dataTable.render.ellipsis(dispEllipsis)
                }], ..... //rest of the code not of interest

The data string might look as followed:

'[{"obj":{"unid":"AE2E4C0DB863DB08C12587B90055F4D1","dateK":"10-24-2021","unit":"06109","comm":"06109","lvl":"sdd","gcn":"","resp":"Nu Present","name":"Nordic News Co","id":"00000000034664","lvlK":"Avslag","type":"PRIVATE"}},{"obj":{"unid":"E8E58FD3EB2453D2C12587BB004B5737","dateK":"4-18-2021","unit":"06409","comm":"06409","lvl":"bordlaggning","gcn":"","resp":"Heute Idag","name":"Universal Deutsche Gemeinte Unlimited","id":"00000000161479","lvlK":"Återremittering","type":"COMPANY"}},{"obj":{"unid":"A13C7AA174FF28B0C12587B90056E6EA","dateK":"10-3-2021","unit":"06325","comm":"06325","lvl":"bordlaggning","gcn":"","resp":"Manana Morgen","name":"Common Deutsche Gemeinte Inc","id":"00000000277853","lvlK":"DD","type":"CORPGROUP"}},{"obj":{"unid":"3DD65EBABE97C603C12587BB004B5D00","dateK":"4-6-2021","unit":"06142","comm":"06142","lvl":"avslag","gcn":"","resp":"Nu Present","name":"Red Firm Corp Co","id":"00000000486674","lvlK":"EDD","type":"PRIVATE"}},{"obj":{"unid":"5F0ECCC070EE16C5C12587B90056B4FC","dateK":"7-27-2021","unit":"06325","comm":"06325","lvl":"avslag","gcn":"","resp":"Past Förtiden","name":"Cosmic Hello World Online Enterprise","id":"00000000517436","lvlK":"DD","type":"CORPGROUP"}}]'

Edited by Colin - Syntax highlighting. Details on how to highlight code using markdown can be found in this guide.

Answers

  • kthorngrenkthorngren Posts: 20,425Questions: 26Answers: 4,794

    I'm not sure if Datatables displays the processing text with Javascript loaded data. However the load time might be quick enough that the processing text, if shown, might not be seen especially with deferRender.

    If the 2 second delay is the ajax processing you can use something like BlockUI or BusyLoad libraries to display a message while waiting for the Ajax response.

    Kevin

Sign In or Register to comment.