0 Replies Latest reply on Feb 18, 2013 2:39 AM by java_x_man

    Richfaces extendedDataTable frozen column not working when has multiple component in same page.

    java_x_man

      Hi All, 

      I'm have an application. It have multiple extendedDataTable like this. 

      #Fisrt extendedDataTable

      <rich:extendedDataTable id="tbGrid1" 
          value="#{bean data}" var="bean"
          frozenColumns="2" rows="5"
          selectionMode="none">
      
          <rich:column width="140px">
              <f:facet name="header">
                  <h:outputText value="Column1" />
              </f:facet>
              <h:outputText value="Column 1 value"/>
          </rich:column>
          .
          .
          <rich:column width="140px">
              <f:facet name="header">
                  <h:outputText value="Column N" />
              </f:facet>
              <h:outputText value="Column n value"/>
          </rich:column>
      </rich:extendedDataTable>
      

      #Second extendedDataTable

      <rich:extendedDataTable id="tbGrid2" 
          value="#{bean data}" var="bean"
          frozenColumns="2" rows="5"
          selectionMode="none">
      
          <rich:column width="140px">
              <f:facet name="header">
                  <h:outputText value="Column1" />
              </f:facet>
              <h:outputText value="Column 1 value"/>
          </rich:column>
          .
          .
          <rich:column width="140px">
              <f:facet name="header">
                  <h:outputText value="Column N" />
              </f:facet>
              <h:outputText value="Column n value"/>
          </rich:column>
      </rich:extendedDataTable>
      

      When generate html and css.

      #Fisrt extendedDataTable

        div.rf-edt-cnt {
              display: block;
          width: 502px;
          }
          .rf-edt-c-j_idt67 {
              width: 50px;
          }
         .rf-edt-td-j_idt67 {
             width: 50px;
         }
      

      #Second extendedDataTable

         

      div.rf-edt-cnt {
              width: 100%;
          }
          .rf-edt-c-j_idt67 {
              width: 50px;
          }
          .rf-edt-td-j_idt67 {
             width: 50px;
          }
      

      I'm not sure but I think the problem is richface generate duplicate "div.rf-edt-cnt" and use this css class in all extendedDataTable.

      because when I view css in FireBug the second "div.rf-edt-cnt" is override first "div.rf-edt-cnt".

       

      How to solve this problem ?.

       

      Environment : JSF 2 (Mojarra 2.1.17), Richfaces 4.3.0 final

      Remark : When I remove second extendedDataTable form this page fisrt extendedDataTable is working.

       

      Thanks,