ADF Faces File Uploading – It is really that simple!

One particularly type of interaction in web applications is typically a little bit tricky. Requiring additional analysis of the frameworks used. For me personally it was even the way to get started with Java technology (Jason Hunter’s Servlet Programming – that’s where for me it all began). I am talking about File Uploading. Functionality required in many applications, and frequently causing some headaches. I am working on an ADF project where we are considering offering an "Excel upload’ facility as method for getting data into the application. Doing some initial investigations, it struck me how extremely simple and straightforward the implementation of file upload with ADF Faces really is!

The steps:

• set the usesUpload property of the af:form element to true
• add an af:inputFile element to the form
• bind the value attribute of this inputFile to a managed bean property of type UploadedFile (oracle.adf.view.faces.model.UploadedFile)
• write code in the setter method for this property to actually do something with the uploaded file contents

And this is all you need to do! Let’s create a simple example that will serve as our stepping stone for uploading CSV and Excel files. We will create a simple application that can upload text files and display their contents and several file details:

Let’s first create a new JDeveloper Application with a new Project. In this project, create a new JSF page (FileUpload.jspx).

Use the af:form tag instead of the h:form and set the usesUpload attribute to true:

<af:form usesUpload="true"> 

Add an inputFile element: 

&lt;af:inputFile label=&quot;File to Upload&quot; columns=&quot;90&quot; <br />                          value=&quot;#{FileProcessor.uploadedFile}&quot;/&gt;<br />            &nbsp;<br />

and tie its value attribute to a managed bean – that we will create in just a moment. 

Add a PanelForm with a number of fields to display the properties of the uploaded file:

&lt;af:panelForm&gt;<br />  &lt;af:inputText label=&quot;File Name&quot; value=&quot;#{FileProcessor.filename}&quot; readOnly=&quot;true&quot;/&gt;<br />  &lt;af:inputText label=&quot;File Size&quot; value=&quot;#{FileProcessor.filesize}&quot; readOnly=&quot;true&quot;/&gt;<br />  &lt;af:inputText label=&quot;File Type&quot; value=&quot;#{FileProcessor.filetype}&quot; readOnly=&quot;true&quot;/&gt;<br />  &lt;af:inputText label=&quot;File Contents&quot; value=&quot;#{FileProcessor.filecontents}&quot; columns=&quot;220&quot; rows=&quot;30&quot; /&gt;<br />&lt;/af:panelForm&gt;<br />

Create the Java Class that will handle the uploaded file:

package nl.amis.adffaces.files;<br /><br />import java.io.IOException;<br /><br />import oracle.adf.view.faces.model.UploadedFile;<br /><br />public class FileProcessor {<br />    private UploadedFile uploadedFile;<br />    private String filename;<br />    private long filesize;<br />    private String filecontents;<br />    private String filetype;<br /><br />    public FileProcessor() {<br />    }<br /><br />    public void setUploadedFile(UploadedFile uploadedFile) {<br />        this.uploadedFile = uploadedFile;<br />        this.filename = uploadedFile.getFilename();<br />        this.filesize = uploadedFile.getLength();<br />        this.filetype = uploadedFile.getContentType();<br />        try {<br />            this.filecontents = parseISToString(uploadedFile.getInputStream());<br />        } catch (IOException e) {<br />            // TODO<br />        }<br />    }<br /><br />    public UploadedFile getUploadedFile() {<br />        return uploadedFile;<br />    }<br /><br />    public void setFilename(String filename) {<br />        this.filename = filename;<br />    }<br /><br />    public String getFilename() {<br />        return filename;<br />    }<br /><br />    public void setFilesize(long filesize) {<br />        this.filesize = filesize;<br />    }<br /><br />    public long getFilesize() {<br />        return filesize;<br />    }<br /><br />    public void setFilecontents(String filecontents) {<br />        this.filecontents = filecontents;<br />    }<br /><br />    public String getFilecontents() {<br />        return filecontents;<br />    }<br /><br />    public void setFiletype(String filetype) {<br />        this.filetype = filetype;<br />    }<br /><br />    public String getFiletype() {<br />        return filetype;<br />    }<br /><br />    // from: http://www.bubble-media.com/cgi-bin/articles/archives/000038.html<br /><br />    public String parseISToString(java.io.InputStream is) {<br />        java.io.DataInputStream din = new java.io.DataInputStream(is);<br />        StringBuffer sb = new StringBuffer();<br />        try {<br />            String line = null;<br />            while ((line = din.readLine()) != null) {<br />                sb.append(line + &quot;\n&quot;);<br />            }<br />        } catch (Exception ex) {<br />            ex.getMessage();<br />        } finally {<br />            try {<br />                is.close();<br />            } catch (Exception ex) {<br />            }<br />        }<br />        return sb.toString();<br />    }<br />}<br />&nbsp;

And finally configure the FileProcessor managed bean in the faces-config.xml file.

&lt;managed-bean&gt;<br />    &lt;managed-bean-name&gt;FileProcessor&lt;/managed-bean-name&gt;<br />    &lt;managed-bean-class&gt;nl.amis.adffaces.files.FileProcessor&lt;/managed-bean-class&gt;<br />    &lt;managed-bean-scope&gt;request&lt;/managed-bean-scope&gt;<br />&lt;/managed-bean&gt;<br /><br />

Now we can run the JSF page. We can press the browse button, select a file, press the Start Upload button and have the file uploaded to the application server. The FileProcessor Bean’s setUploadedFile method is invoked and the properties and contents are extracted from the UploadedFile object and set on the other bean properties.

Resources

Download JDeveloper 10.1.3.2 Application: ADFFacesUploadFile.zip.