3 Replies Latest reply on Feb 25, 2014 5:06 AM by ppitonak

rich:collapsiblePanel does not work in version 4.3.5.Final

deepak26v Feb 21, 2014 5:35 PM

I am facing an issue in my JSF project where the collapsiblePanel does not collapse or expand on click. Basically it is not responding to the on-click events. I am not sure if I am missing something. I even copy pasted the same code from showcase (Richfaces demo site) but I face the same problem. I am facing this issue on IE 8 and Chrome. The same issue happens when I try the tabPanel control. Please help me.

Following is my HTML:

<ui:composition

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/>

<rich:collapsiblePanel header="Overview" switchType="client">

RichFaces is a component library for JSF and an advanced framework for

easily integrating AJAX capabilities into business applications.

</rich:collapsiblePanel>

<p>

<b>And that panel switched by ajax and closed by default:</b>

</p>

<rich:collapsiblePanel header="JSF 2 and RichFaces 4" expanded="false" switchType="client">

<p>We are working hard on RichFaces 4.0 which will have full JSF 2 integration. That is not all though, here is

a summary of updates and features:</p>

</rich:collapsiblePanel>

</ui:composition>

I have attached a GIF image which depicts the issue when I click on panels.

Note: The JSF version in my project is 2.2.5 and RichFaces 4.3.5.Final.

webpage.gif 1.5 MB

1. Re: rich:collapsiblePanel does not work in version 4.3.5.Final

ppitonak Feb 24, 2014 5:51 AM (in response to deepak26v)

Hi,

collapsiblePanel works fine in 4.3.5.Final. Did you copy&paste this code snippet? If yes, you need to change it slightly for the collapsiblePanel to work:

<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:body>
<rich:collapsiblePanel header="Overview" switchType="client">
         RichFaces is a component library for JSF and an advanced framework for
         easily integrating AJAX capabilities into business applications.
     </rich:collapsiblePanel>
     <p>
         <b>And that panel switched by ajax and closed by default:</b>
     </p>
     <rich:collapsiblePanel header="JSF 2 and RichFaces 4" expanded="false" switchType="client">
         <p>We are working hard on RichFaces 4.0 which will have full JSF 2 integration. That is not all though, here is
             a summary of updates and features:</p>
     </rich:collapsiblePanel>
</h:body>
</html>

Regards,
Pavol
Actions
2. Re: rich:collapsiblePanel does not work in version 4.3.5.Final

deepak26v Feb 24, 2014 10:35 AM (in response to ppitonak)

Thank you so much Pavol. It works like a charm now. Yes I copy pasted this code from the showcase website.

On another note, I was trying to customize the font of the collapsiblePanel header. I see a property called "headerClass" but somehow I am not able to make it work. Here is the code:

<rich:collapsiblePanel header="Client Info" switchType="client" headerExpandedClass="panelHeaderClass">

and here is the declaration for the class:
<h:head>
     <style>
       .panelHeaderClass {
            font-size:9pt;
     }
</style>
</h:head>

Could you please help me ? Looks like I am missing something again.
Actions
3. Re: rich:collapsiblePanel does not work in version 4.3.5.Final

ppitonak Feb 25, 2014 5:06 AM (in response to deepak26v)

You do it correctly, however, it doesn't work as expected because your class is always overwritten by RichFaces CSS classes.

This should help:
<style>
       .panelHeaderClass {
            font-size:9pt !important;
     }
</style>
Actions

Go to original post