3 Replies Latest reply on Sep 1, 2009 6:03 AM by ilya_shaikovsky

    Dynamic styling to rich:tabs

    snowhite

      Hi all,

      I am using rich:tabPanel in my project. I need to set different style class to each tab based on the tab selected. I want to do this on the server side using backing bean. Can anyone help me with this.

      Thanks.

        • 1. Re: Dynamic styling to rich:tabs
          ilya_shaikovsky

          so just use EL in proper classes attributes.

          • 2. Re: Dynamic styling to rich:tabs
            snowhite

            Thank you for your reply.

            I tried to use EL to set the style class for rich tabs.
            Below is my code snippet. I used a4j:jsFunction to dynamically set style class to my tabs, based on tab selected. Now, the problem is with the "reRender" attribute. When I set the "reRender" attribute to "tabPanel1" (id of the rich:tabPanel) all the tabs are being rendered again and now the style class is same for every tab. I cannot use id of the <rich:tab> as richfaces is generating a component id for each tab. Is there any way I can make it work. I hope I am clear in explaining my problem.

            <rich:tabPanel switchType="client" id="tabPanel1" selectedTab="#{styleBean.selectedTab}" inactiveTabClass="inActiveTab" activeTabClass="#{styleBean.styleClass}" >
             <c:forEach items="#{authenticator.modulesToDisplay}" var="module">
            
             <rich:tab id="#{module.name}" name="#{module.name}" label="#{module.name}" ontabenter="myFunc('#{module.name}')" >
             <a4j:include viewId="#{module.viewId}" />
             </rich:tab>
            
             </c:forEach>
            </rich:tabPanel>
            
            <a4j:jsFunction action="#{styleBean.setStyleClass}" name="myFunc" ajaxSingle="true" reRender="tabPanel1">
             <a4j:actionparam name="moduleName">
             </a4j:actionparam>
            </a4j:jsFunction>
            

            Thanks

            • 3. Re: Dynamic styling to rich:tabs
              ilya_shaikovsky

              unfortunatelly id of the tab is id of the content wrapper element. So you should update the tabpanel.