We developed this recipe with NetBeans 6.8, JSF 2.0, and GlassFish v3. The JSF 2.0 classes were obtained from the NetBeans JSF 2.0 bundled library. In addition, we have used PrimeFaces 2.0, which provides support for JSF 2.0. You can download this distribution from http://www.primefaces.org/. The PrimeFaces libraries (including necessary dependencies) are in the book code bundle, under the /JSF_libs/PrimeFaces JSF 2.0 folder.

PrimeFaces offers these four upload types through a single component named p:fileUpload, and configured through its attributes as follows:

Now, we wrote a JSF form that integrates the fileUpload component with the following characteristics:

Now, the p:fileUpload complete tag reference is available at http://primefaces.prime.com.tr/docs/tag/. You will be pleased to find out that you can customize this component exactly as you want.

Now, let's see code of JSF page for our upload:

…
<h:form enctype="multipart/form-data" prependId="false">
<p:growl id="messages" showSummary="true" showDetail="true" />
<p:fileUpload fileUploadListener="#{uploadBean.handleFileUpload}"
update="messages" sizeLimit="1073741824"
multiple="true" label="choose"
allowTypes="*.jpg;*.png;*

;"
description="Images"/>
</h:form>
…

Now, the UploadBean implements the hadleFileUpload method like this:

public class UploadBean {
private static final int BUFFER_SIZE = 6124;
/** Creates a new instance of UploadBean */
public UploadBean() {
}
public void handleFileUpload(FileUploadEvent event) {
ExternalContext extContext = FacesContext.getCurrentInstance().
getExternalContext();
File result = new File(extContext.getRealPath
("//WEB-INF//upload") + "//" + event.getFile().getFileName());
try {
FileOutputStream fileOutputStream = new
FileOutputStream(result);
byte[] buffer = new byte[BUFFER_SIZE];
int bulk;
InputStream inputStream = event.getFile().getInputstream();
while (true) {
bulk = inputStream.read(buffer);
if (bulk < 0) {
break;
}
fileOutputStream.write(buffer, 0, bulk);
fileOutputStream.flush();
}
fileOutputStream.close();
inputStream.close();
FacesMessage msg = new FacesMessage("Succesful",
event.getFile().getFileName() + " is uploaded.");
FacesContext.getCurrentInstance().addMessage(null, msg);
} catch (IOException e) {
e.printStackTrace();
FacesMessage error = new FacesMessage("The files were
not uploaded!");
FacesContext.getCurrentInstance().addMessage(null, error);
}
}
}

The upload example is ready, but we still need to add some configuration in the web.xml descriptor (these configurations do not alter the PrimeFaces default configurations). These are specific to upload process and they are listed next:

Now, if you test our upload you will see something like in the following screenshot:

As you can see the PrimeFaces upload is based on a filter and on a listener. The filter intercepts requests in front of the Faces Servlet and detects the upload requests, while the listener requires an FileUploadEvent object, which extends the javax.faces.event.FacesEvent. The upload process is configured in the JSF page through the p:uploadFile component, and it is controlled by the developer in the listener implemented in a managed bean, like you just saw.

The code bundled with this book contains a complete example of this recipe. The project can be opened with NetBeans 6.8 and it is named: PPR_multi_file_upload_with_PrimeFaces_2_0.