Searching while data is still loading shows "No data available in table"

ashley.mercer

Firstly, huge thanks for DataTables - it's awesome

Description of problem:
We load data asynchronously with the ajax options, and some of our API responses take a few seconds to return. While the query is running the table correctly shows "Loading..."

However if the user starts to search (e.g. by typing something in the search box) before the response has come back, the table switches to show "No data available in table" which is confusing.

Would it be possible to preserve the "Loading..." state as long as AJAX is running - even if the user has started searching?

Link to test case:
https://live.datatables.net/socirone/45/edit

I've created a test case which articially delays loading for 10 seconds. During that time, type anything in the search box in the right panel.

kthorngren

Possibly disabling the search input during initialization then re-enabling once the Datatable is ready will do what you want. See this updated test case:
https://live.datatables.net/welehixa/1/edit

It uses the preInit event to disable the input using the selector. $('input.dt-input', api.table().container()) with table().container() to get the appropriate table. The ready() is used to enable the input once Datatables is ready.

You can also use jQuery or Javascript to hide/show or style the input in such away to let the user know when it's ready for use.

Kevin

allan

This is an interesting one - I've put it into my issue list to look at as I can see that showing "Loading" until the first data is retrieved makes sense. At the moment it is done simply by looking at the draw counter. If it is the first draw, show "Loading..." otherwise there is an assumption that data must have been loaded. I'll need to add another variable to say if data has been loaded.

Allan

ashley.mercer

Thanks for the quick response Kevin.

Ah that would be a good start, although from a user's perspective they often already know what they want to search for, so I guess it would be nice if we can let them start to type straight away rather than making them wait.

(Yes, there's a separate discussion about making my API responses faster - I'm working on that too! )

I guess my question is really two things, both around the state tracking that DT does internally:

1. surprise that initiating search while the table is still loading changes the state from "Loading" to anything else: intuitively, I would have expected it to stay in "Loading" until the table is completely ready - would DT consider switching to that behaviour?
2. searching on a table that is "empty" (because the AJAX response is still running) produces "No data available in table" rather than "No matching records found" - this seems incorrect to me, isn't "No data" reserved for the case where the table is genuinely empty?

ashley.mercer

I've also found a workaround: another forum post pointed out that zeroRecords can be a function (although this isn't documented as far as I can see)

https://datatables.net/forums/discussion/comment/225597

So I can do something similar here:

{
  language: {
    emptyTable: function() {
      return table.ready() ? "No data available in table" : "Loading..."
    }
  }
}

Will using a function here be supported officially (and if not, could it) or is this liable to change in future?

kthorngren

Good find. That does seem to work in this updated test case:
https://live.datatables.net/socirone/47/edit

@allan will need to comment about the official support of using language.emptyTable as a function.

Kevin

allan

The problem with functions for the language strings is that it doesn't work with the JSON loaded translation files. As such a function for a language string, although it might work, isn't supported and might not work in future versions.

I like the idea of using the ready flag though - I'd forgotten about that. I'll look into this next.

Allan

allan

I've committed a change to DataTables so that it will show the "Loading..." message until data has actually been loaded.

The nightly now has that change and it will be in the next release .

Allan