Upload File in Richfaces

Posted: April 26, 2012 in JSEE

<ui:composition xmlns=”http://www.w3.org/1999/xhtml&#8221;
xmlns:ui=”http://java.sun.com/jsf/facelets&#8221;
xmlns:h=”http://java.sun.com/jsf/html&#8221;
xmlns:f=”http://java.sun.com/jsf/core&#8221;
xmlns:a4j=”http://richfaces.org/a4j&#8221;
xmlns:rich=”http://richfaces.org/rich”&gt;

<style>
.top {
vertical-align: top;

}
.info {
height: 202px;
overflow: auto;
}
</style>

<h:form>
<h:panelGrid columns=”2″ columnClasses=”top,top”>
<rich:fileUpload fileUploadListener=”#{fileUploadBean.listener}”
maxFilesQuantity=”#{fileUploadBean.uploadsAvailable}”
id=”upload”
immediateUpload=”#{fileUploadBean.autoUpload}”
acceptedTypes=”jpg, gif, png, bmp” allowFlash=”#{fileUploadBean.useFlash}”>
<a4j:support event=”onuploadcomplete” reRender=”info” />
</rich:fileUpload>
<h:panelGroup id=”info”>
<rich:panel bodyClass=”info”>
<f:facet name=”header”>
<h:outputText value=”Uploaded Files Info” />
</f:facet>
<h:outputText value=”No files currently uploaded”
rendered=”#{fileUploadBean.size==0}” />
<rich:dataGrid columns=”1″ value=”#{fileUploadBean.files}”
var=”file” rowKeyVar=”row”>
<rich:panel bodyClass=”rich-laguna-panel-no-header”>
<h:panelGrid columns=”2″>
<a4j:mediaOutput element=”img” mimeType=”#{file.mime}”
createContent=”#{fileUploadBean.paint}” value=”#{row}”
style=”width:100px; height:100px;” cacheable=”false”>
<f:param value=”#{fileUploadBean.timeStamp}” name=”time”/>
</a4j:mediaOutput>
<h:panelGrid columns=”2″>
<h:outputText value=”File Name:” />
<h:outputText value=”#{file.name}” />
<h:outputText value=”File Length(bytes):” />
<h:outputText value=”#{file.length}” />
</h:panelGrid>
</h:panelGrid>
</rich:panel>
</rich:dataGrid>
</rich:panel>
<rich:spacer height=”3″/>
<br />
<a4j:commandButton action=”#{fileUploadBean.clearUploadData}”
reRender=”info, upload” value=”Clear Uploaded Data”
rendered=”#{fileUploadBean.size>0}” />
</h:panelGroup>
</h:panelGrid>
</h:form>
</ui:composition>

http://livedemo.exadel.com/richfaces-demo/richfaces/fileUpload.jsf

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s