I have some JS code that uses XMLHttpRequest to get an XML file then loops through to display each item from the file. This happens relatively quickly but there is about a second delay before the content shows up--I want to display a loading message while that is happening.
Everything's working great in Firefox, but all the webkit browsers I've tried (Chrome + Safari), don't display the loading message in any fashion. It's not that the function to display the loading message isn't firing (because if I open it and then take out the code to close it, it does appear after all the XML processing is done).
I've even tried making opening the loading message a prerequisite (with setTimeout even, to make sure it's not just happening too fast), for running the XMLhttprequest, and it still don't show up.
My hypothesis is that the browsers seem wait until all the processing is completed (ie: the XML file has been downloaded and converted to HTML) before doing anything. So both the open and close loading message functions are firing, but they're "let loose" at the same time so the net result is no loading message.
Does anyone have any idea what's going on?
I'm not exactly at liberty to disclose the code, so I'm hoping there is some known issue with this that someone is aware of, without having to show all my code.
Thanks so much!
Simplify the problem by removing as much as possible, until either the problem goes away, or until you have a simple test page that can be disclosed.
One of the techniques you may want to apply is to use the onload or ondomready event to trigger the AJAX request, so that the web browser can then update the page with the loading message before retrieving the content.
Still couldn't figure it out.
In the end I ended up applying a style to the a:active pseudo-class in CSS for the link that was being clicked, which disappeared once page loading was complete and the link was no longer active.