How can I asynchronously show/hide div in JSP using Java

Question

I want to programmatically show a div tag after some processing has completed while rendering a JSP. What's the best way to do this using Java? Using jQuery I would do this:

$('#mydiv').removeClass("hide_me");

...or...

$('#mydiv').show();

How can I do this programmatically in Java while rendering the page?

Solution 1

Assuming you have the standard JSP setup including JSTL and have mapped it to 'c' you could just do:

<c:if test="${myCondition}">
  <div id="mDiv">
    content
  </div>
</c:if>

It does seem from the comments like there is some confusion about rendering JSP on the server vs rendering content in the browser. Everything that happens in the JSP is server side work that has to completely finish before the browser receives the generated document and starts drawing it. You can't use JSP to change content that is already on the user's screen. You need javascript, html5, etc, for that.

Solution 2

With JSP Java runs on the server (unlike JavaScript that runs within browser) so conditionally render your <DIV> using Java if statement within JSP:

<% if( test="true" ) { %>
  <DIV>....</DIV>
<% } %>

Solution 3

I think you are looking for something like this:

<div id="loader">Loading / GIF animation</div>
<div id="result" style="display:none;">
  Lots of data.
  Should be flushed to the browser every now and then.
  This will take seconds...
</div>
<script type="text/javascript">
  $("#loader").hide();
  $("#result").show();
</script>

Comments

[Jasper de Vries]

What do you mean? If a condition in a bean is met then output some inline Javascript?

[Dave Newton]

Not quite sure what you mean; if the response stalls because you're doing something in-appropriately synchronous in Java the response is just that--stalled, you can't continue to respond to modify the DOM.

[Brian]

No. My JSP is loading a bunch of data that takes a long time to complete. In the JSP I hide the div tag because I don't want to display the table until all of the data is loaded. So, when the JSP completes the data loading process, I simply want to unhide the div tag.

[jeff]

You could invoke the heavy computing from an AJAX call and then display it when it's ready.

[Brian]

Using AJAX and server-side processing is our plan for the next release. I'm looking for a simpler interim solution for now.

[Richard JP Le Guen]

Isn't the use of scriptlets discouraged in favor of JSTL and UEL?

[Jasper de Vries]

But you could use JSP to output Javascript. I think that is what Brian is looking for.

[Brian]

This would have worked, but I found another solution. The table that I'm populating is a DataTable, so I was able to hook into the fnInitComplete callback to show the div tag after the data is completely loaded. Thanks for the help and ideas.

[topchef]

feel free to change it to JSTL