CODEWITHSUNDEEP
jqueryjsf-2primefaces
mpaulse
mpaulse

Reputation: 97

Display a Loading/Splash Screen while a JSF page is being rendered?

I have an JSF site where some of the data items take a while to display because of the amount of data being rendered.

I know how to use things like BlockUI on button clicks to show a waiting message while the action or AJAX is being performed.

However, I cannot figure out how to trigger something similairly when I type in the URL directly and go to the page. When I use onload or onready events it barely flashes the message right before displaying the page.

Any ideas?

Upvotes: 4

Views: 2302

Answers (1)

Manuel
Manuel

Reputation: 4228

Because you did not provide any code regarding your

When I use onload or onready events it barely flashes the message right before displaying the page.

I assume that you did it correctly. What about this solution? The server executes some processing in the backing bean while the client queries the server 'if he is done'?

Serverside:

@YourScope (> @RequestScope)
@ManagedBean
public class MyBean {

  private boolean renderDone = false;

  @PostConstruct
  public void renderLotOfData() {
    renderDone = false;
    // do something which takes a long time here
    renderDone = true;
  }

  public boolean isRenderDone() {
    return this.renderDone;
  }

}

Clientside:

showMySplash(); // initial call

function renderDoneBlockUi() {
  var renderDone = $('#renderDone').val();
  if (renderDone) {
    hideMySplash();
  } else {
    setTimeout(checkRenderDone, 1000);
  }
}

<h:inputHidden value="#{myBean.renderDone}" id="renderDone" />

<p:remoteCommand name="checkRenderDone" update="renderDone" actionListener="#{myBean.renderDone}" autoRun="true" oncomplete="renderDoneBlockUi" />

References

Upvotes: 2

Related Questions