12 Replies Latest reply on Aug 12, 2011 10:26 AM by Bharath Navali

    Probleme Richfaces 4 FileUpload & JSF 2

    orkin Newbie

      Hi (sorry for my bad english, I'm french.)

       

      I use richfaces 4.0.Final and JSF 2

       

      I have a problem with de fileUpload's compenent. I have copy the example from the showcase richfaces 4 for fileUploadBean and from richfaces 3.3.3 showcase for UploadedImage Object.

       

      I show you my code but it is the same than showcase :

       

      my file.xhtml :

       

      <html xmlns="http://www.w3.org/1999/xhtml"
          xmlns:h="http://java.sun.com/jsf/html"
          xmlns:f="http://java.sun.com/jsf/core"
          xmlns:ui="http://java.sun.com/jsf/facelets"
          xmlns:a4j="http://richfaces.org/a4j"
          xmlns:rich="http://richfaces.org/rich">
      
      <h:outputStylesheet>
      .top {
          vertical-align: top;
      }
      
      .info {
          height: 202px;
          overflow: auto;
      }
      </h:outputStylesheet>
      
      <rich:panel>
          <h:form>
              <h:panelGrid columns="2" columnClasses="top,top">
                  <rich:fileUpload fileUploadListener="#{fileUploadBean.listener}" 
                      id="upload" acceptedTypes="jpg, gif, png, bmp">
                      <a4j:ajax event="uploadcomplete" execute="@none" render="info" />
                  </rich:fileUpload>
                  <h:panelGroup id="info" layout="block" rendered="#{fileUploadBean.size > 0}">
                      <rich:panel bodyClass="info">
                          <f:facet name="header">
                              <h:outputText value="Uploaded Files Info" />
                          </f:facet>
                          <h:outputText value="No files currently uploaded" />
                          <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="image/jpeg"
                                          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>
                      <br />
                      <a4j:commandButton action="#{fileUploadBean.clearUploadData}"
                          render="info, upload" value="Clear Uploaded Data" />
                  </h:panelGroup>
              </h:panelGrid>
          </h:form>
      </rich:panel>
      
      </html>
      

       

       

      my fileUploadBean :

       

      @ManagedBean(name = "fileUploadBean")
      @SessionScoped
      public class FileUploadBean implements Serializable {
      
          private static final long serialVersionUID = 8301770521196265438L;
      
          private ArrayList<UploadedImage> files = new ArrayList<UploadedImage>();
      
          public FileUploadBean() {
      
          }
      
          public void paint(OutputStream stream, Object object) throws IOException {
              stream.write(getFiles().get((Integer) object).getData());
              stream.close();
          }
      
          public void listener(FileUploadEvent event) throws Exception {
              UploadedFile item = event.getUploadedFile();
              UploadedImage file = new UploadedImage();
              file.setLength(item.getData().length);
              file.setName(item.getName());
              file.setData(item.getData());
              files.add(file);
          }
      
          public String clearUploadData() {
              files.clear();
              return null;
          }
      
          public int getSize() {
              if (getFiles().size() > 0) {
                  return getFiles().size();
              } else {
                  return 0;
              }
          }
      
          public long getTimeStamp() {
              return System.currentTimeMillis();
          }
      
          public ArrayList<UploadedImage> getFiles() {
              return files;
          }
      
          public void setFiles(ArrayList<UploadedImage> files) {
              this.files = files;
          }
      
      }
      
      

       

      and my UploadedImage.java

       

      public class UploadedImage {
      
          private int length;
          private String name;
          private byte[] data;
      
          public UploadedImage() {
      
          }
      
          public int getLength() {
              return length;
          }
      
          public void setLength(int length) {
              this.length = length;
          }
      
          public String getName() {
              return name;
          }
      
          public void setName(String name) {
              this.name = name;
          }
      
          public byte[] getData() {
              return data;
          }
      
          public void setData(byte[] data) {
              this.data = data;
          }
      
      }
      
      

       

       

      The component fileUpload bug because I don't have the "style" of buttons :

       

      http://img811.imageshack.us/img811/8588/bugo.th.png

       

       

      Left before upload and right after. (I have just the message "Aucune information de style ne semble associée à ce fichier XML. L'arbre du document est affiché ci-dessous.")

       

      This problem is not very important for me but just for style.

       

      My real problem is when I click on Upload button the listener fileUploadBean.listener is not call and I don't know why. For me all is OK and I don't find anything to help me with my problem. Other method of my class are called but the listener is not call.

       

      I attach my web.xml

       

      I don't need specialy this component richfaces fileUpload but i need upload file, if anybody can help me to fix my problem where can I find code for uploadFile with Richfaces 4.0.Final and JSF2

       

      I hope someone can help me, thx for help in advance

       

      Orkin

        • 1. Re: Probleme Richfaces 4 FileUpload & JSF 2
          Nick Belaevski Master

          Hi,

           

          Try adding h:head/h:body tags to the page.

          • 2. Re: Probleme Richfaces 4 FileUpload & JSF 2
            orkin Newbie

            Hi Nick Belaevski,

             

            I have add h:head and h:body tags to my page but there is no change.

             

            The style of component fileUpload don't change but it's not very important for me in first time and the listener is not call. Other method from my bean FileUpload are call correctly like getSize() but only listener bug .

             

            Other idea plz ?

             

            Orkin

            • 3. Re: Probleme Richfaces 4 FileUpload & JSF 2
              orkin Newbie

              Someone can help me ?

              • 4. Re: Probleme Richfaces 4 FileUpload & JSF 2
                Saroj Padhy Novice

                Hi Orkin,

                 

                I tried your code and I found it's working fine! listener is getting called on each upload action.

                I am using, Mojarra 2.1.0 (JSF2), Richfaces v.4.0.0.Final

                 

                I just added h:head/h:body to your page, as below:

                 

                <html xmlns="http://www.w3.org/1999/xhtml"
                    xmlns:h="http://java.sun.com/jsf/html"
                    xmlns:f="http://java.sun.com/jsf/core"
                    xmlns:ui="http://java.sun.com/jsf/facelets"
                    xmlns:a4j="http://richfaces.org/a4j"
                    xmlns:rich="http://richfaces.org/rich">
                
                <h:head></h:head>
                <h:body>
                
                <your outputStylesheet>
                <your panel>
                
                </h:body> 
                </html>
                
                

                 

                Thanks,

                Saroj

                • 5. Re: Probleme Richfaces 4 FileUpload & JSF 2
                  orkin Newbie

                  Thx a lot for your help. I will try it.

                   

                  Can you show me your project configuration with majarra 2.1.0 maybe I don't use the same implementation of JSF 2 than you.

                  • 6. Re: Probleme Richfaces 4 FileUpload & JSF 2
                    Saroj Padhy Novice

                    Hi again,

                     

                    here is my web.xml

                     

                    <?xml version="1.0" encoding="UTF-8"?>
                    <web-app version="2.5"
                        xmlns="http://java.sun.com/xml/ns/javaee" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
                        xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd">
                        <display-name>richfaces 4 test</display-name>
                        <context-param>
                            <param-name>org.richfaces.skin</param-name>
                            <param-value>blueSky</param-value>
                        </context-param>
                        <context-param>
                            <param-name>org.richfaces.enableControlSkinning</param-name>
                            <param-value>false</param-value>
                        </context-param>
                        <servlet>
                            <servlet-name>Faces Servlet</servlet-name>
                            <servlet-class>javax.faces.webapp.FacesServlet</servlet-class>
                            <load-on-startup>1</load-on-startup>
                        </servlet>
                        <servlet-mapping>
                            <servlet-name>Faces Servlet</servlet-name>
                            <url-pattern>*.jsf</url-pattern>
                        </servlet-mapping>
                        <welcome-file-list>
                            <welcome-file>index.html</welcome-file>
                            <welcome-file>index.htm</welcome-file>
                            <welcome-file>index.jsp</welcome-file>
                            <welcome-file>default.html</welcome-file>
                            <welcome-file>default.htm</welcome-file>
                            <welcome-file>default.jsp</welcome-file>
                        </welcome-file-list>
                        <login-config>
                            <auth-method>BASIC</auth-method>
                        </login-config>
                    </web-app>
                    

                     

                    faces-config.xml

                     

                    <?xml version="1.0" encoding="UTF-8"?>
                    <faces-config version="2.0"
                        xmlns="http://java.sun.com/xml/ns/javaee"
                        xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
                        xsi:schemaLocation="
                          http://java.sun.com/xml/ns/javaee
                          http://java.sun.com/xml/ns/javaee/web-facesconfig_2_0.xsd">
                    
                    </faces-config>
                    
                    1 of 1 people found this helpful
                    • 7. Re: Probleme Richfaces 4 FileUpload & JSF 2
                      orkin Newbie

                      Hi again .

                       

                      I have added my code <rich:panel>...</rich:panel> to an index.xhtml file and the component works very fine. So the code I use is good ...

                       

                      Now my problem is when I call a request before clic on the upload button of fileUpload component the listener is not called and I don't know why.

                       

                      In my index.xhtml it's work very fine and in an other file.xhtml who will add to my page by a dynamic <ui:input src="{myBean.page}" /> called by link in my menu (h:commandLink or a4j:commandLink). I have the probleme with both.

                       

                      Thx in advance.

                       

                      Sorry if you have problems to understand me, I'm French.

                       

                      Orkin

                      • 8. Re: Probleme Richfaces 4 FileUpload & JSF 2
                        Bharath Navali Newbie

                        Hi Orkin,

                         

                        Listener wont be called before u click upload button. Once after u click add button and select a file (valid) it will be listed in the panel but in this interaction never a listener will be called. Only after clicking upload a listener will be called.

                         

                        bachchu

                        • 9. Re: Probleme Richfaces 4 FileUpload & JSF 2
                          orkin Newbie

                          I know, my probleme is when I do a request before click on my upload button, the listener does not be called

                          • 10. Re: Probleme Richfaces 4 FileUpload & JSF 2
                            Niklas B Newbie

                            Bonjour Orkin,

                             

                            we had a similar problem wich had to do with the JSF implementation we are using. Maybe it's the same? We're using the MyFaces JSF implementation version 2.1.1 and Richfaces 4. There is a forum post which contains two fixes (hacks?) you must apply to make it work.

                             

                            http://community.jboss.org/message/598858

                             

                            Hope this helps,

                            Nik

                            • 11. Re: Probleme Richfaces 4 FileUpload & JSF 2
                              orkin Newbie

                              Hi,

                              I use Mojara implementation of JSF and i have fix my probleme who was very stupid. My MenuBean that I use to dispatch my differents view was save in request and not in session so when I click on the upload button the MenuBean is instanciate and my view become the default that I use.

                               

                              I have an other problem but I think it's better to create a new poste.

                               

                              Thx a lot.

                               

                              Orkin

                              • 12. Re: Probleme Richfaces 4 FileUpload & JSF 2
                                Bharath Navali Newbie

                                Hi Orkin/All,

                                 

                                Does anyone knows how to prompt an alert once after user clicks add button in the rich:fileupload.

                                 

                                My question is: when a user selects add in fileupload and selects a file, is there any event which ll be triggered after this(before uploading the file).

                                 

                                Thanks in advance,

                                Bachchu