CODEWITHSUNDEEP
jsf-2primefaces
AlanObject
AlanObject

Reputation: 9943

using p:fileUpload with AJAX

I am using PrimeFaces p:fileUpload to transfer images to the backing bean as per the manual like so:

                <h:outputLabel value="Select Files:" />
                <p:fileUpload fileUploadListener="#{uploadImage.doUpload}"
                                  multiple="true"
                                  allowTypes="/(\.|\/)(gif|jpe?g|png)$/"
                                  description="Select Images"                                      
                                  update="@form"
                                  />

The component allows the user to select a number of files to upload in a batch, which is really convenient. However before storing them in the data base I want the user to type in more information (i.e. an image title) so the doUpload() method takes the uploaded files and saves them to a property named work which is a list of objects.

Later in the page (inside the same h:form) I have a data table that shows the uploaded files that need to be processed.

                <p:dataTable
                    value="#{uploadImage.work}"
                    var="unit"
                    resizableColumns="true"
                    rendered="#{not empty uploadImage.work}">

The problem is that the data table is only redrawn once, no matter how many files get uploaded. The doUpload() method gets called each file. So when I click the Upload button on the component the p:dataTable appears, but only has one row in it no matter what. If I refresh the screen all the rows appear.

Is there any way to re-render the p:dataTable each time doUpload() exits?

Upvotes: 2

Views: 3347

Answers (1)

kolossus
kolossus

Reputation: 20691

Use primefaces RequestContext component to update your datatable on the server side. e.g.

  public void myFileUploadListener(FileUploadEvent event){
   //All your processing goes here
   RequestContext reqContext = RequestContext.getCurrentInstance();  //get your hands on request context
   reqContext.update(":form:myDatatable"); //update the datatable for each execution

  }

Upvotes: 2

Related Questions