Updating ProgressBar in JSF

1

Good afternoon, I'm doing an asynchronous method that does searches the database (oracle), and returns it in an Excel file. Within my Method has for

@Async
public synchronized void carregarApresentacoesParaExportar() {
    try {
        ...............
        for(int i = 0 ; i < qtdePages; i++){
            if(isBaixado){
                percent = 0;
                qtdePages=0;
                break;
            } else {
                exportar.configurarValores(transacoes.getContent());
                if(transacoes.hasNext()){
                        transacoes = getService(enumType).buscarPaginado(getFiltro(), new PageRequest(transacoes.nextPageable().getPageNumber(), MAX_EXPORTAR));
                }
                percent = ((i * 100) / qtdePages);
            } 
        }
        ...............
    } catch (Exception e) { 
        LOG.error(e, e);
        geraMsgErro("txt.erro.download.excel");
        FileUtils.deleteQuietly(arquivo); 
    }
}

I use the variable percent to tell each increment how much is completed. In my view I do so

<p:progressBar widgetVar="pbAjax" ajax="true" value="#{notificacaoMB.percent}" labelTemplate="{value}%"
                                                styleClass="animated" global="false">
                                                <p:ajax event="complete" listener="#{notificacaoMB.onComplete}" />
                                            </p:progressBar>

                                            Outra ProgressBar

                                            <div class="progress progress-striped active">
                                                <div style="width: #{notificacaoMB.percent}%" id="progress" aria-valuemax="100" aria-valuemin="0" aria-valuenow="#{notificacaoMB.percent}" role="progressbar" class="progress-bar progress-bar-success">
                                                    <span >#{notificacaoMB.percent}%</span>
                                                </div>
                                            </div>

Active with this command

<h:commandButton title="#{messages['label.iniciar']}"
                                                value="#{messages['label.iniciar']}"
                                                actionListener="#{notificacaoMB.carregarApresentacoesParaExportar()}"
                                                onclick="PF('pbAjax').start();PF('startButton').disable();"
                                                widgetVar="startButton"
                                                rendered="#{notificacaoMB.possoIniciar()}"
                                                styleClass="btn btn-primary" />

It works with Primefaces . But the solution I want is Bootstrap progress progress-striped .

is thus running:

I'mnotsurewhattodowiththis:

HowdoIworkusingBootstrap?Itriedthissolution How to create a dynamic progress bar by considering all the fields in a form? . But I could not implement, how do I do with Jquery / Javascript?

    
asked by anonymous 23.11.2017 / 21:33

2 answers

-1

The way is to continue using primefaces since there are still many other dependencies to pull out of the project. kkk

    
15.12.2017 / 20:54
1

You can put your bootstrap component inside a JSF component and update the JSF component through the ManagedBean:

<h:form id="meuForm">
    <h:panelGrid id="meuPanel">
        <div class="progress progress-striped active">
            <div style="width: #{notificacaoMB.percent}%" id="progress" 
                aria-valuemax="100" aria-valuemin="0" 
                aria-valuenow="#{notificacaoMB.percent}" 
                role="progressbar" class="progress-bar progress-bar-success">
                <span >#{notificacaoMB.percent}%</span>
            </div>
        </div>
    </h:panelGrid>
</h:form>
import org.primefaces.context.RequestContext;

@ManagedBean
public class MeuManagedBean {

    @Async
    public synchronized void carregarApresentacoesParaExportar() {
        /* ..códigos... */
        percent = ((i * 100) / qtdePages);
        RequestContext.getCurrentInstance().update("meuForm:meuPanel");
        /* ..códigos... */
    }
}
    
24.11.2017 / 17:52