Richfaces使用a4j：ajax渲染

Question

I have a page that uses rich:fileUpload and a a4j:commandButton what I want to achieve is, the first time the page is loaded the fileUpload shoul appear(be rendered, my backingBean default is true and so it renders correctly) and when the user hits the commandButton I would love to hide the fileUpload and show an outputText (this is not happening, no error at all)

How can I solve this, my pagelooks like

    <div id="content">
        <a4j:outputPanel id="contentForm">
            <h:form enctype="multipart/form-data"
                    rendered="#{uploadBean.formRendered}">

                <br/><br/>

                <h:selectOneRadio value="#{uploadBean.selectedOption}">
                    <f:selectItems value="#{uploadBean.loadOptions}"/>
                </h:selectOneRadio>

                <br/>

                <rich:fileUpload addLabel="Agregar" clearAllLabel="Quitar todos"
                                 clearLabel="Quitar" deleteLabel="Quitar"
                                 doneLabel="Completado" uploadLabel="Subir archivos"
                                 fileUploadListener="#{uploadBean.doUpload}"
                                 acceptedTypes="txt, csv"
                                 noDuplicate="true"/>

                <a4j:commandButton value="Iniciar validación"
                                   action="#{uploadBean.doLaunchProcess}"
                                   render="processLabel"
                                   execute="@form"
                                   />

            </h:form>
        </a4j:outputPanel>
        <a4j:outputPanel id="processLabel">
            <h:outputText
                value="#{uploadBean.processStarted}"
                rendered="#{not uploadBean.formRendered}"/>
        </a4j:outputPanel>
    </div>

and the code of the action of the commandButton is:

public String doLaunchProcess() {
    formRendered = false;
    InfoValidator iv = new InfoValidator(loadOptions, 
            selectedOption, userBean.getDependencia(), 
            userBean.getTipoDependencia(), userBean.getUsuario(),
            userBean.getIdUsuario(), userBean.getEmail());
    iv.start();
    return "carga-archivos";
}

Is seems that formRendered is always evaluated to true when I want it to be false once a user clicks the button and so the fileUpload hides and show the outputText.

UPDATE Basically what I want is the user to upload files an when the user clicks on the button the fileUpload component dissapears and a outputText appears and said something like "Thanks for uploading"

Maybe my approach is wrong, just put me in the right direction, I'm kind of confuse with the ajax stuff.

Cheers,

Answer 1

Finally I did it !

Here's the code so you can see the modifications. Basically I had to process the the whole form (execute="@form") which a4j:commandButton does already and then render="contentForm :processLabel".

I was only rendering (reRendering?) just the processLabel and the form was always there 'cause I wasn't updating the view (I think this has to be with the DOM tree, someone clarify this please)

    <div id="content">
        <a4j:outputPanel id="contentForm">
            <h:form enctype="multipart/form-data"
                    rendered="#{uploadBean.formRendered}">

                <br/><br/>

                <h:selectOneRadio value="#{uploadBean.selectedOption}">
                    <f:selectItems value="#{uploadBean.loadOptions}"/>
                </h:selectOneRadio>

                <br/>

                <rich:fileUpload addLabel="Agregar" clearAllLabel="Quitar todos"
                                 clearLabel="Quitar" deleteLabel="Quitar"
                                 doneLabel="Completado" uploadLabel="Subir archivos"
                                 fileUploadListener="#{uploadBean.doUpload}"
                                 acceptedTypes="txt, csv"
                                 noDuplicate="true"/>

                <a4j:commandButton value="Iniciar validación"
                                   action="#{uploadBean.doLaunchProcess}"
                                   render="contentForm :processLabel"/>

            </h:form>
        </a4j:outputPanel>
        <a4j:outputPanel id="processLabel">
            <h:outputText
                value="#{uploadBean.processStarted}"
                rendered="#{not uploadBean.formRendered}"/>
        </a4j:outputPanel>
    </div>

the backing bean remains the same.

Cheers!!!