CODEWITHSUNDEEP
jsfbuttonfile-uploadrenderingprimefaces
BRabbit27
BRabbit27

Reputation: 6623

Render p:commandButton after uploading a file p:fileUpload

I have a page with a p:fileUpload and a p:commandButton the first time the page is visited the button should be hidden and just after a file was uploaded the button should be rendered. My code looks like follows, any ideas on how to achieve this?

    <h:form enctype="multipart/form-data" >

        <p:fileUpload
            fileUploadListener="#{fileUploadController.handleFileUpload}"
            mode="advanced"
            multiple="true"
            sizeLimit="2000000000"
            allowTypes="/(\.|\/)(txt|csv)$/"
            required="true"
            label="Seleccionar"
            uploadLabel="Subir a servidor"
            cancelLabel="Cancelar">
        </p:fileUpload>

        <p:commandButton id="btnValidar" value=" Validar "
                         rendered="#{fileUploadController.btnRendered}"
                         style="margin-left: 430px;"/>

    </h:form>

Upvotes: 3

Views: 9285

Answers (1)

BalusC
BalusC

Reputation: 1109292

Just use the update attribute the same way as on all other PrimeFaces ajax components.

<p:fileUpload update="@form" />

I of course assume that you've set btnRendered to true inside handleFileUpload method.

Please note that you can't set it to the ID of the button itself, simply because it's not present in the HTML DOM tree when the btnRendered defaults to false. It's namely JavaScript which does the updating job in the HTML DOM tree based on the retrieved Ajax response. If you want to update alone the button, not the form, then wrap it in another component which is always present in the HTML DOM tree:

<h:panelGroup id="btnValidar">
    <p:commandButton rendered="#{fileUploadController.btnRendered}" />
</h:panelGroup>

and update it as follows

<p:fileUpload update="btnValidar" />

See also:

Upvotes: 8

Related Questions