Search code examples
jsfrichfacesjsf-1.2

Custom link like rich:simpleTogglePanel

I want to change the style of the rich:simpleTogglePanel to look like as a common link would.

http://livedemo.exadel.com/richfaces-demo/richfaces/simpleTogglePanel.jsf?c=simpleTogglePanel&tab=usage

This page shows exactly what I want to do and what I'm getting right now. I want to do something that looks exactly like the 'View source' link that stands below every example. The code I'm using is the same as seen in the 'Client Switch Type' example:

 <rich:simpleTogglePanel switchType="client" label="Client Switch Type" height="90px">
                    The switching between showing and hiding the toggle panel content
                    performs on the client side.
 </rich:simpleTogglePanel>

My goal is to create an 'advanced search' link under a search bar. The panel will contain the advanced search contents. (the extra fields)

I'm using JSF 1.2 and Richfaces.

Solution

  • First, thanks for the answers!

    I asked for a way to change the simpleTogglePanel so it looked like the view source link in the page mentioned, but I found that was the wrong way to go.

    I achieved my goal using a h:commandLink:

    <h:commandLink value="Advanced Search" action="#{MyBean.toggleHiddenPanel }" />

    to change the value of a boolean in my bean and used the rendered attribute to show/hide the fields I needed:

    <h:panelGrid id="hiddenPanel" columns="4" >

                    <h:outputText value="date1:" rendered="#{MyBean.hiddenPanel}" />
                    <rich:calendar value="#{MyBean.date1}" rendered="#{MyBean.hiddenPanel}"
                        locale="US" popup="true" datePattern="d/M/yy HH:mm"
                        cellWidth="24px" cellHeight="22px" style="width:200px" />

                    <h:outputText value="date2:" rendered="#{MyBean.hiddenPanel}" />
                    <rich:calendar value="#{MyBean.date2}" locale="US" rendered="#{MyBean.hiddenPanel}"
                        popup="true" datePattern="d/M/yy HH:mm" cellWidth="24px"
                        cellHeight="22px" style="width:200px" />

                    <br />
                    <h:outputText value="Another field:" rendered="#{MyBean.hiddenPanel}" />

</h:panelGrid>

    ps.: I changed the name of the variables because the project is confidential