asked on

How to show a "Loading..." icon when page is loading?

I have used the following code, but I still get a blank page when the data is loading. How do I display a "loading..." when the data is loading and disappear after that?

<%

out.println("Loading...");

String recordSQL = "SELECT * from BS_PERSON ";
ResultSet rset = CM.executeQuery(recordSQL);
while (rset.next()) {
out.println(rset.getString("USERNAME");
}
%>

Thank you.

searlas

This needs two answers. First, to get "Loading..." displayed straight off you need to call out.flush() straight after your "Loading..." println (required, because your JSP output is probably bufffered by default.)

Secondly, getting the 'Loading...' message to disappear after the page has loaded. One option is to wrap the 'loading' message in an HTML tag (div/span/h1 etc.) and then use a Javascript onload handler to hide it, like this:

<body onLoad="document.getElementById('loading').style.display = 'none'">
<div id="loading">Loading....</div>
<%
out.flush();
String recordSQL = "SELECT * from BS_PERSON ";
ResultSet rset = CM.executeQuery(recordSQL);
while (rset.next()) {
out.println(rset.getString("USERNAME");
}
%>

cpuburst

Hi Jean,

Suppose, If you have two pages, a.jsp and b.jsp, Put a page in between them, say loading.html
which displays whatever message or image you want to show to the user viz. "Page is loading..please wait."

Now a.jsp has to submit to loading.html and in the body onload event of loading.html, submit, the form in loading.html
to b.jsp. This will ensure, the user sees the loading.html until b.jsp processing is done and data flushed to the client.

Cheers
Cpuburst

ASKER CERTIFIED SOLUTION

jarasa

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial

Tuan_Jean

ASKER

Thank you all for your answer. I have tried the out.flush method and it does not work very well because I can see loading... and the records together.

How can I split the points for cpuburst and jarasa?

jarasa

I guess is too late now.
Javier

How to show a &quot;Loading...&quot; icon when page is loading?

How to show a "Loading..." icon when page is loading?