3 Replies Latest reply on Apr 12, 2010 6:18 AM by Nick Belaevski

    scrollable datatable renders an extra column

    karthik kasier Newbie

      Hi

       

      I am using rich faces 3.3.2 scrollable datatable .i have three columns to render i get an extra column .i have checked this in rich faces demo also

       

      here is the code

       

      <rich:scrollableDataTable rowKeyVar="rkv" frozenColCount="1" height="400px"
          width="700px" id="carList" rows="40" columnClasses="col"
          value="#{dataTableScrollerBean.allCars}" var="category" sortMode="single"
          binding="#{dataTableScrollerBean.table}"
          sortOrder="#{dataTableScrollerBean.order}"
          selection="#{dataTableScrollerBean.selection}">

          <rich:column id="make">
           <f:facet name="header"><h:outputText styleClass="headerText" value="Make" /></f:facet>
           <h:outputText value="#{category.make}" />
          </rich:column>
          <rich:column id="model">
           <f:facet name="header"><h:outputText styleClass="headerText" value="Model" /></f:facet>
           <h:outputText value="#{category.model}" />
          </rich:column>
          <rich:column id="price">
           <f:facet name="header"><h:outputText styleClass="headerText" value="Price" /></f:facet>
           <h:outputText value="#{category.price}" />
          </rich:column>
        
         </rich:scrollableDataTable>

       

      i have only 3 columns but i get an extra column rendered . iam attaching the bmp file please have a look and help me

        • 1. Re: scrollable datatable renders an extra column
          Ilya Shaikovsky Master

          seems wrong image

           

          Extra column added because of resizing feature. You could restyle it using css. (turning borders for this column off)

          • 2. Re: scrollable datatable renders an extra column
            karthik kasier Newbie

            Hi

             

            Thanks for the previous reply  

            Can u please just check the code i have put.i have 3 columns .i didnt resize it  .You can reproduce that extra column with the code i have posted

            it give that extra column as it looks in image.

             

            i have tried to do this for that extra column it didnt worked

             

            <style>
               .scrolls{
                width:300px;
                height:200px;
                overflow:auto;
               }
              
               .col {
            width: 100px;
                              }
                 
               .col4 {
            width: 0px;
            border:0px;
                            
                 }
              </style>
              <h:form>
               <rich:spacer height="30" />
               <rich:scrollableDataTable rowKeyVar="rkv" frozenColCount="1" height="400px"
                width="700px" id="carList" rows="40" columnClasses="col,col,col4"
                value="#{dataTableScrollerBean.allCars}" var="category" sortMode="single"
                binding="#{dataTableScrollerBean.table}"
                sortOrder="#{dataTableScrollerBean.order}"
                selection="#{dataTableScrollerBean.selection}">

                <rich:column id="make">
                 <f:facet name="header"><h:outputText styleClass="headerText" value="Make" /></f:facet>
                 <h:outputText value="#{category.make}" />
                </rich:column>
                <rich:column id="model">
                 <f:facet name="header"><h:outputText styleClass="headerText" value="Model" /></f:facet>
                 <h:outputText value="#{category.model}" />
                </rich:column>
                  
               </rich:scrollableDataTable>

            </h:form>

            </ui:composition>

             

            still extra column persists

             

            can you please help me with this.

            • 3. Re: scrollable datatable renders an extra column
              Nick Belaevski Master

              This column is used to fill table space when overall width of columns is not enough to cover table space. When columns are resized, they are taking space from this extra column.

               

              So, set width for the first & second columns to the appropriate values.