2 Replies Latest reply on Aug 4, 2011 7:31 AM by chandrkant

    styling problem in the first item of rich:accordion

    ainanmis
    ainanmis Jul 20, 2011 4:11 AM

      Hi,

      I am using Richfaces 4 Final and JSF 2.X . All accordion items includes a panelGrid with a specific height, and they displaying properly except the first one, but the first item doesn't apply css codes given to. For example;

       

      <rich:accordion switchType="client">

                                  <rich:accordionItem header="#{msgs_anadolu.tutarBilgileri}">

                                      <h:panelGrid style="height:250px;">

                                                   .........

       

                                        </h:panelGrid>

                                  <rich:accordionItem>

                                    <rich:accordionItem header="#{msgs_anadolu.ameliyatBilgileri}">

                                      <h:panelGrid style="height:250px;">

                                                 ...................

                                         </h:panelGrid>

                                  <rich:accordionItem>

       

                                    ....

       

                                    ...

       

      <rich:accordion>

      The height of the first item is bigger than 250px, but other items have height 250 px.

      Are there anybody knowing the reason?

      • 1883 Views
      • Tags:
        • 1. Re: styling problem in the first item of rich:accordion
          ainanmis
          ainanmis Jul 22, 2011 9:45 AM (in response to ainanmis)

          I assume that it is a bug. Are there anybody using alternative way for the solution?

            • Actions
          • 2. Re: styling problem in the first item of rich:accordion
            chandrkant
            chandrkant Aug 4, 2011 7:31 AM (in response to ainanmis)

            Hi,

              I face the same problem , I was Iterating <rich:accordionItem> using <c:forEach> .

            I don't know the exact reason , but there is alternate solution so tht code can work fine

            #  On first Item  add style= "height: 0px;"   and  disabled="true"

            # So Second Item is your actually workable item .

             

             

            <h:form>   

                <rich:accordion switchType="client"  >

                    <rich:accordionItem header="Click On name to See Details"

                                        style="height: 0px;" disabled="true">

                    </rich:accordionItem>

                    <c:forEach items="#{mbean.getList}" var="list" >

                        <rich:accordionItem >

                            <f:facet name="header">

                                <h:outputText value="#{list.name}" />

                            </f:facet>

                            <rich:panel >

                                <h:outputText value="Values " />

                            </rich:panel>           

                        </rich:accordionItem>

                    </c:forEach>           

                </rich:accordion>

            </h:form>       

              • Actions