<rich:progressbar> Progress bar is shown only when method is finished

Question

I want to use a progress bar to display the progress of importing data. So when I press a button I call the method to start the import and would like to show the progress with a progress bar. But for some reason the bar is shown when the method is finished and shows 100%. When I refresh the page to progress bar doesn't disappear.

Here is my JSP:

<h:panelGrid styleClass="footBtnBar" columns="2"
                     cellpadding="0" cellspacing="0">
            <h:panelGroup style="float:left">
                <rich:progressBar mode="ajax" value="#{excelImportController.currentValue}" interval="1000" id="pb"
                                  enabled="#{excelImportController.pgEnabled}" minValue="0" maxValue="100"
                                  reRenderAfterComplete="progressPanel">

                    <h:outputText value="#{excelImportController.currentValue} %" />
                </rich:progressBar>

            </h:panelGroup>
            <h:panelGroup style="float:right">
                <a4j:commandLink action="#{excelImportController.startImport}" reRender="pb" 
                                 styleClass="buttonOra120">
                    <h:outputText value="#{bundleDataImport['Label.import.data']}" />
                </a4j:commandLink>
            </h:panelGroup>
        </h:panelGrid>

In my Bean I have a method that is called when I press the button and there I set the current value of the progress bar. Also setter and getter for the current value:

public class ExcelImportController {
    private int currentValue;
    private boolean pgEnabled = false;

    public String startImport() {
       // in this method I set the current value
       // and pgEnabled=true
    }

    public int getCurrentValue() {
      return (currentValue * 100) / numberOfSheets;
    }

    public void setCurrentValue(int currentValue) {
      this.currentValue = currentValue;
    }

Answer 1

this is because JSF can only handle one ajax request at a time. So the ajax request for the progress bar is only executed if the import ajax request has finished.

You have to spawn a thread so the import-request finishes immediately

Answer 2

I did more or less like this:

Page xhtml:

<rich:progressBar 
 mode="ajax"
 enabled="true"
 value="#{method.currentValue}"
 interval="2000" 
 id="pb"
 minValue="0"
 maxValue="100" 
 reRenderAfterComplete="progressPanel">
  <h:outputText  value="#{method.currentValue} %" />
</rich:progressBar>

button:

<div class="buttons">
  <a4j:jsFunction id ="buton"
  name="buton"
  action="#{method.enable}"/>
</div>

Java:

public void increment() {
  if (currentValue < 100) {
    currentValue += 2;
  }
  if (currentValue >= 100) {
   setEnabled(false);
  }
}

public int getCurrentValue() {
  increment();
  return currentValue;
}