8 Replies Latest reply on Mar 30, 2012 1:19 PM by robertvhenkhaus

    Problems after migrating to JSF 2.0 and RichFaces 4.1.0Final

    srd.pl

      I have updated my project to richfaces 4.1.0 and JSF 2.0. I have abviously changed the maven dependencies, updated web.xml, faces-config.xml, swtiched from *.jsp files to *.xhtml files, updated all head,body,form to h:head, h:body, h:form. However, I have significant problems with my page layout and a4j:ajax behavior. I think that it's best if I just list the problems:

       

      • My rich:datatable skin stopped working. I even tried deleting the columnClass etc. attributes from the tag to leave it with default bluesky skin, but the outcome looks just like a plain html table (no lines, no background, no colors).
      • the a4j:axjax tag works much worse thatn a4j:support did. For my selectOneMenus I tried event="change" but it doesn't work. Only after adding a valueChangedListener to the tags and tried event="valueChange" it worked.
      • rich:calendar elements are not 'clickable' - when I move the coursor over the button to popup the calendar it's not changing and when I click on the button nothing happens. I also need the a4j:ajax here but am not able to test it.
      • Although event="valueChange" worked on selectOneMenu, my a4j:mediaOutput image is not re-rendered. And the chart was the reason why I switched to JSF 2.0 because I needed to use the session-data-helper mechanism to load the images. Is there a special mechanism to rerender (or now 'render' with a4j:ajax) this element when it's using the session-data-helper for loading data?

       

      Here are the web.xml and index.xhtml files:

       

       

      <?xml version="1.0" encoding="UTF-8"?>

      <web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"

      xmlns="http://java.sun.com/xml/ns/javaee"

      xmlns:web="http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd"

      xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd"

      id="WebApp_ID"

      version="2.5">

        <display-name>presentation graph</display-name>

       

          <context-param>

            <param-name>javax.faces.FACELETS_LIBRARIES</param-name>

            <param-value>/WEB-INF/data-helper.taglib.xml</param-value>

          </context-param>

       

          <context-param>

            <param-name>javac.faces.PROJECT_STAGE</param-name>

            <param-value>Development</param-value>

          </context-param>

       

        <context-param>

              <param-name>org.richfaces.SKIN</param-name>

              <param-value>blueSky</param-value>

          </context-param>

       

        <welcome-file-list>

              <welcome-file>index.xhtml</welcome-file>

          </welcome-file-list>

       

        <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>*.xhtml</url-pattern>

        </servlet-mapping>

        <servlet-mapping>

          <servlet-name>Faces Servlet</servlet-name>

          <url-pattern>*.faces</url-pattern>

        </servlet-mapping>

      </web-app>

       

       

      index.xhtml

       

      <html xmlns="http://www.w3.org/1999/xhtml"

            xmlns:f="http://java.sun.com/jsf/core"

            xmlns:h="http://java.sun.com/jsf/html"

            xmlns:a4j="http://richfaces.org/a4j"

            xmlns:rich="http://richfaces.org/rich"

            xmlns:sdh="http://richfaces.org/session-data-helper">   

       

       

      <h:head>

       

               <title>Graph presentation</title>

       

          <h:outputStylesheet name="style.css" library="css" />

      </h:head>

       

      <h:body>

              <h:form id="form">

       

              <div class="grid_2">

                  <rich:calendar value="#{formBean.date}"

                                  id="date" popup="true" datePattern="yyyy/MM/dd"

                                  showApplyButton="false" cellWidth="24px" cellHeight="22px" style="width:200px">

                  <a4j:ajax event="change" render="resultTable chart" execute="@this" listener="#{formBean.dateSelected}"/>             

                  </rich:calendar>

              </div>

       

              <div class="grid_2">

               <h:selectOneMenu id="selectMenu" value="#{formBean.model.selected_id}" valueChangeListener="#{formBean.selected}" styleClass="comboBoxes">

                   <f:selectItems value="#{formBean.myModelValues}" />

                   <a4j:ajax  execute="@this" event="valueChange"  render="resultTable chart"  ajaxSingle="true"/>

               </h:selectOneMenu>

              </div>

       

              <div id="list" class="container2">

              <rich:dataTable id="resultTable" value="#{formBean.results}" var="query" rows="10" headerClass="columnclass" rowClasses="rowclass" styleClass="datatable" cellpadding="1" cellspacing="1" rules="rows" >

       

                     <rich:column headerClass="columnclass"  width="100" >

                             <f:facet name="header">   

                                 <h:outputText value="Values" style="align:center; text-align:center; " />

                             </f:facet>

                        <h:outputText value="#{query.val}" />

                     </rich:column>           

                     <rich:column headerClass="columnclass"  width="100" >

                             <f:facet name="header">   

                                 <h:outputText value="Models" style="align:center; text-align:center; " />

                             </f:facet>

                        <h:outputText value="#{query.model}" />

                     </rich:column>   

                     <f:facet name="footer">

                         <rich:dataScroller page="#{formBean.page}" style="margin-left: 15%; margin-right: 15%; width: 70%;">

                                <f:facet name="first">

                                          <h:outputText value="First" />

                                </f:facet>

                                <f:facet name="last">

                                          <h:outputText value="Last" />

                                </f:facet>

                          </rich:dataScroller>

                      </f:facet>

                  </rich:dataTable>

            </div>

       

            <div id="graph" class="container2">

                          <a4j:mediaOutput

                               id="chart"

                               element="img"

                               cacheable="false"

                               session="true"

                               createContent="#{mediaPainter.drawChartImage}"

                               value = "#{sdh:storeData(formBean.chartData)}"

                               mimeType="image/jpeg"

                               />      

            </div>  

                 </h:form>

      </h:body>

      </html>    

       

      here is a list of .jar files deployed with the webapp:

      commons-logging-1.1.1.jar
      cssparser-0.9.5.jar
      guava-r08.jar
      jcommon-1.0.16.jar
      jfreechart-1.0.13.jar
      jsf-api-2.1.6.jar
      jsf-impl-2.1.6.jar
      jstl-1.2.jar mysql-connector-java-5.1.18.jar oscache-2.3.jar richfaces-components-api-4.1.0.Final.jar richfaces-components-ui-4.1.0.Final.jar richfaces-core-api-4.1.0.Final.jar richfaces-core-impl-4.1.0.Final.jar sac-1.3.jar

        • 1. Re: Problems after migrating to JSF 2.0 and RichFaces 4.1.0Final
          healeyb

          A few suggestions:

           

          1. Change org.richfaces.SKIN to org.richfaces.skin.

           

          2. selectOneMenu. I'd recommend getting rid of the event= attribute from a4j:ajax, use the default. It's not the

              fault of richfaces but the similarity between the "change" and "valueChange" names causes a lot of confusion.

              valueChange is the right option so this won't be causing your problem.

           

              ajaxSingle is replaced by execute="@this", so it can be removed.

           

              Can you describe exactly what it is that doesn't work? it would be usual to have a VCL that get's the new

               selectOneMenu value (getNewValue()) and then reloads the content of formBean.results for display in the

               dataTable.

           

          3. rich:calendar. You need a visual effect on mouseover on the calendar? have a look at the component reference

              guide css classes, .rf-cal-hov looks promising for dates in the calendar. Not sure about the popup button, but

              take a look through the lengthy list of options.

           

             The big problem seems to be that nothing happens when you click the popup button. Do you use a browser with

              good javascript debugging capabilities? If you use google chrome, just hit ctrl+shift+J, reload the page and I'd

              bet that there's a javascript error in the console window. Are you using any jQuery calendar plugins?

           

          Regards,

          Brendan.

          • 2. Re: Problems after migrating to JSF 2.0 and RichFaces 4.1.0Final
            srd.pl

            Hi Brendan,

             

            Thanks for the contribution, unfortunately so far no progress:

             

            1. I have changed the skin as you suggested - I saw that the elements have actualy aquired it (became blue) but the datatable remains without any skinning. But if the other elements (like buttons etc) have changed it means that the css files must be loaded. Why is the datatable tag not working with them...

             

            2. Right now when I used event="valueChange" the behaviour seems to be chacking in properly. The results is rerendered correctly, but the a4j:mediaOutput does not. Does it has to do sth with session-data-helper? Off course I change the values for the chart in the Java Bean code. Off course everything was working great in JSF 1.2 but I needed to start using the sdh because the image became too big and this was the reson I jumped to JSF 2.0 and Rich 4.

             

            Also I don't quite get why would you want me to remove the event="valueChange" attribute - how am I going to render the results then?

             

            3. No, I don't want any mouseover special effect. I was only reffering to the fact that normally when you move mouse over the popup button, the cursor changes by default. Now it doesn't and when you click on the button nothing happens. The java console had thrown 3 errors:

             

            Uncaught TypeError: Cannot read property 'Calendar' of undefined

            (anonymous function)index.xhtml:1

            runScriptsjsf.js.xhtml:1

            elementReplaceStrjsf.js.xhtml:1

            doUpdatejsf.js.xhtml:1

            responsejsf.js.xhtml:1

            richfaces.queue.responserichfaces-queue.js.xhtml:407

            jsf.ajax.responserichfaces-queue.js.xhtml:50

            onCompletejsf.js.xhtml:1

            req.xmlReq.onreadystatechangejsf.js.xhtml:1

             

            Uncaught TypeError: Cannot read property 'DataScroller' of undefined

            (anonymous function)index.xhtml:1

            runScriptsjsf.js.xhtml:1

            elementReplaceStrjsf.js.xhtml:1

            doUpdatejsf.js.xhtml:1

            responsejsf.js.xhtml:1

            richfaces.queue.responserichfaces-queue.js.xhtml:407

            jsf.ajax.responserichfaces-queue.js.xhtml:50

            onCompletejsf.js.xhtml:1

            req.xmlReq.onreadystatechangejsf.js.xhtml:1

             

            Uncaught TypeError: Cannot read property 'DataTable' of undefined

            (anonymous function)index.xhtml:1

            runScriptsjsf.js.xhtml:1

            elementReplaceStrjsf.js.xhtml:1

            doUpdatejsf.js.xhtml:1

            responsejsf.js.xhtml:1

            richfaces.queue.responserichfaces-queue.js.xhtml:407

            jsf.ajax.responserichfaces-queue.js.xhtml:50

            onCompletejsf.js.xhtml:1

            req.xmlReq.onreadystatechange

             

            • 3. Re: Problems after migrating to JSF 2.0 and RichFaces 4.1.0Final
              healeyb

              It looks like you have some rf 3.3/jsf1.2 code sitting in your project somewhere. Have you done a clean and build?

              check all your includes, any jars on the classpath etc... there's some old stuff there somewhere.

               

              As for removing event=, "valueChange" is the component default, let it do the work for you.

               

              If you want the cursor to change on mouse over then that is a mouseover special effect. There may be a slight

              difference in behavior between the earlier and present versions but it wouldn't be any fun without these differences!

               

              Regards,

              Brendan.

              1 of 1 people found this helpful
              • 4. Re: Problems after migrating to JSF 2.0 and RichFaces 4.1.0Final
                srd.pl

                Yes I actually did the cleaning a couple of times. However I decided to create the proejct from scratch using the maven archetype:generate tool. After bringing the source codes the results is that the errors that chrome tool was throwing don't appear anymore and the calendar popup button started to work. However the pupup calendar also has no skin, and is in fact transparent text. Clinking on the dates causes them to change (you can see the new date in the text fields) but the ajax events don't fire up. Everything else still remains so the lack of skin for datatable and problem with rendering the a4j:medaiOutput.

                 

                Moreover I have discovered that apart from my css files the page has only skinning.css file which does not have the classes form calendar & datatable. Shouldn't be more css files with the classes?

                • 5. Re: Problems after migrating to JSF 2.0 and RichFaces 4.1.0Final
                  healeyb

                  Chrome dev tools has the elements, resources & network tabs. Do you see any resources with a number next to

                  them when you reload the page? or anything in the network tab highlighted in red?

                  1 of 1 people found this helpful
                  • 6. Re: Problems after migrating to JSF 2.0 and RichFaces 4.1.0Final
                    srd.pl

                    No the resources remain the same. And in network there is also nothing in red. But there must be something with the project setup, as the needed css (or should they be ecss in Rich4?) are not included. Maybe that is also the reson the ajax events are not working as expected. II have now noticed that my a4j:mediaoutput element is re-rendered correctly in chrome but not in firefox...

                     

                    I post the jar files that are with the proejct (changes with regard to 1st post) and the pom.xml as I use maven.

                     

                    cssparser-0.9.5.jar   

                    mysql-connector-java-5.1.18.jar

                    ehcache-1.6.0.jar     

                    richfaces-components-api-4.1.0.Final.jar

                    guava-r08.jar        

                    richfaces-components-ui-4.1.0.Final.jar

                    javax.faces-2.1.3.jar

                    richfaces-core-api-4.1.0.Final.jar

                    jcommon-1.0.16.jar   

                    richfaces-core-impl-4.1.0.Final.jar

                    jfreechart-1.0.13.jar 

                    sac-1.3.jar

                    jstl-api-1.2.jar

                     

                    <?xml version="1.0" encoding="UTF-8"?>
                    <project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
                       
                    xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd">

                       
                    <modelVersion>4.0.0</modelVersion>

                       
                    <groupId>org.models.presentation.</groupId>
                       
                    <artifactId>graph_presentation</artifactId>
                       
                    <name>graph_presentation</name>
                       
                    <version>Final</version>
                       
                    <packaging>war</packaging>

                       
                    <url>http://jboss.org/richfaces</url>

                       
                    <repositories>
                           
                    <!-- You should seriously consider using a repository manager or declare repositories in your settings.xml.
                               See http://www.sonatype.com/people/2009/02/why-putting-repositories-in-your-poms-is-a-bad-idea/   -->

                           
                    <repository>
                               
                    <id>jboss-public-repository-group</id>
                               
                    <name>JBoss Public Maven Repository Group</name>
                               
                    <url>https://repository.jboss.org/nexus/content/groups/public-jboss/</url>
                               
                    <layout>default</layout>
                               
                    <releases>
                                   
                    <enabled>true</enabled>
                                   
                    <updatePolicy>never</updatePolicy>
                               
                    </releases>
                               
                    <snapshots>
                                   
                    <enabled>true</enabled>
                                   
                    <updatePolicy>never</updatePolicy>
                               
                    </snapshots>
                           
                    </repository>
                       
                    </repositories>
                       
                    <pluginRepositories>
                           
                    <pluginRepository>
                               
                    <id>jboss-public-repository-group</id>
                               
                    <name>JBoss Public Maven Repository Group</name>
                               
                    <url>https://repository.jboss.org/nexus/content/groups/public-jboss/</url>
                               
                    <layout>default</layout>
                               
                    <releases>
                                   
                    <enabled>true</enabled>
                                   
                    <updatePolicy>never</updatePolicy>
                               
                    </releases>
                               
                    <snapshots>
                                   
                    <enabled>true</enabled>
                                   
                    <updatePolicy>never</updatePolicy>
                               
                    </snapshots>
                           
                    </pluginRepository>
                       
                    </pluginRepositories>

                       
                    <properties>
                           
                    <project.build.sourceEncoding>UTF-8</project.build.sourceEncoding>
                           
                    <maven.compiler.source>1.6</maven.compiler.source>
                           
                    <maven.compiler.target>1.6</maven.compiler.target>
                           
                    <!-- Setting this property using archetype-metadata.xml requiredPorperty
                                 so that generated project uses correct version of richfaces.
                             -->

                           
                    <org.richfaces.bom.version>4.1.0.Final</org.richfaces.bom.version>
                       
                    </properties>

                       
                    <build>
                           
                    <finalName>individuel_broadcast3</finalName>
                           
                    <plugins>
                               
                    <plugin>
                                   
                    <artifactId>maven-compiler-plugin</artifactId>
                                   
                    <version>2.3.2</version>
                               
                    </plugin>
                               
                    <plugin>
                                   
                    <artifactId>maven-war-plugin</artifactId>
                                   
                    <version>2.1.1</version>
                               
                    </plugin>
                           
                    </plugins>
                       
                    </build>

                       
                    <dependencyManagement>
                           
                    <dependencies>
                               
                    <dependency>
                                   
                    <groupId>org.richfaces</groupId>
                                   
                    <artifactId>richfaces-bom</artifactId>
                                   
                    <version>${org.richfaces.bom.version}</version>
                                   
                    <scope>import</scope>
                                   
                    <type>pom</type>
                               
                    </dependency>
                           
                    </dependencies>
                       
                    </dependencyManagement>

                       
                    <dependencies>
                           
                    <dependency>
                               
                    <groupId>org.richfaces.ui</groupId>
                               
                    <artifactId>richfaces-components-ui</artifactId>
                           
                    </dependency>
                           
                    <dependency>
                               
                    <groupId>org.richfaces.core</groupId>
                               
                    <artifactId>richfaces-core-impl</artifactId>
                           
                    </dependency>
                           
                    <dependency>
                               
                    <groupId>javax.faces</groupId>
                               
                    <artifactId>javax.faces-api</artifactId>
                               
                    <scope>provided</scope>
                           
                    </dependency>
                           
                    <dependency>
                               
                    <groupId>org.glassfish</groupId>
                               
                    <artifactId>javax.faces</artifactId>
                               
                    <scope>compile</scope>
                           
                    </dependency>
                           
                    <dependency>
                               
                    <groupId>javax.servlet</groupId>
                               
                    <artifactId>servlet-api</artifactId>
                               
                    <scope>provided</scope>
                           
                    </dependency>
                           
                    <dependency>
                               
                    <groupId>javax.servlet.jsp</groupId>
                               
                    <artifactId>jsp-api</artifactId>
                               
                    <scope>provided</scope>
                           
                    </dependency>
                           
                    <dependency>
                               
                    <groupId>javax.el</groupId>
                               
                    <artifactId>el-api</artifactId>
                               
                    <scope>provided</scope>
                           
                    </dependency>
                           
                    <dependency>
                               
                    <groupId>javax.servlet.jsp.jstl</groupId>
                               
                    <artifactId>jstl-api</artifactId>
                           
                    </dependency>

                           
                    <dependency>
                               
                    <groupId>net.sf.ehcache</groupId>
                               
                    <artifactId>ehcache</artifactId>
                           
                    </dependency>
                           
                    <dependency>
                               
                    <groupId>jfree</groupId>
                               
                    <artifactId>jfreechart</artifactId>
                               
                    <version>1.0.13</version>
                           
                    </dependency>
                           
                    <dependency>
                               
                    <groupId>mysql</groupId>
                               
                    <artifactId>mysql-connector-java</artifactId>
                               
                    <version>5.1.18</version>
                           
                    </dependency>
                       
                    </dependencies>

                       
                    <profiles>
                           
                    <profile>
                               
                    <id>jee6</id>
                               
                    <build>
                                   
                    <plugins>
                                       
                    <plugin>
                                           
                    <artifactId>maven-war-plugin</artifactId>
                                           
                    <configuration>
                                               
                    <webappDirectory>${project.build.directory}/${project.build.finalName}-jee6</webappDirectory>
                                               
                    <classifier>jee6</classifier>
                                           
                    </configuration>
                                       
                    </plugin>
                                   
                    </plugins>
                               
                    </build>

                               
                    <dependencies>
                                   
                    <dependency>
                                       
                    <groupId>javax.faces</groupId>
                                       
                    <artifactId>javax.faces-api</artifactId>
                                       
                    <scope>provided</scope>
                                   
                    </dependency>
                                   
                    <dependency>
                                       
                    <groupId>org.glassfish</groupId>
                                       
                    <artifactId>javax.faces</artifactId>
                                       
                    <scope>provided</scope>
                                   
                    </dependency>
                                   
                    <dependency>
                                       
                    <groupId>javax.transaction</groupId>
                                       
                    <artifactId>jta</artifactId>
                                       
                    <version>1.1</version>
                                       
                    <scope>provided</scope>
                                   
                    </dependency>
                               
                    </dependencies>
                           
                    </profile>
                           
                    <profile>
                               
                    <id>release</id>
                               
                    <build>
                                   
                    <plugins>
                                       
                    <plugin>
                                           
                    <artifactId>maven-war-plugin</artifactId>
                                           
                    <executions>
                                               
                    <execution>
                                                   
                    <id>jee6</id>
                                                   
                    <phase>package</phase>
                                                   
                    <goals>
                                                       
                    <goal>war</goal>
                                                   
                    </goals>
                                                   
                    <configuration>
                                                       
                    <webappDirectory>${project.build.directory}/${project.build.finalName}-jee6</webappDirectory>
                                                       
                    <classifier>jee6</classifier>
                                                       
                    <packagingExcludes>WEB-INF/lib/javax.faces*</packagingExcludes>
                                                       
                    <warSourceExcludes>WEB-INF/lib/javax.faces*</warSourceExcludes>
                                                   
                    </configuration>
                                               
                    </execution>
                                           
                    </executions>
                                       
                    </plugin>
                                   
                    </plugins>
                               
                    </build>
                           
                    </profile>
                       
                    </profiles>

                    </project>

                    • 7. Re: Problems after migrating to JSF 2.0 and RichFaces 4.1.0Final
                      srd.pl

                      The problem turned out to be the in the tomcat container, which is quite perplexing but the same proejct worked on a different tomcat instance.

                      • 8. Re: Problems after migrating to JSF 2.0 and RichFaces 4.1.0Final
                        robertvhenkhaus

                        srd,

                        have you had time to analyze the differences in your tomcat container enviroments? I ask because I have a similar problem with skinning with Tomcat 7.0.25. However I would be reluctant to pursue using a different Tomcat instance to resolve it without more evidence your results would follow.