JSF column Tag

This section tells you about the JSF html column tag which is used for creating columns of a table. This tag creates a data column inside a data table. By this table you can specify number of column and fix these with some specific values. You can specify the value for specific column by using data array. JSF data table creates multiple rows up to the length of array or number of elements associated with the data table.

This section provides you a complete code of a program in which the column tags are used inside the data table. This program will help you for the procedure of using column tag for creating columns in a table.

Code Description:

<%@ page contentType="text/html" %>

            <%@ taglib uri="http://java.sun.com/jsf/html" prefix="h" %>

            <%@ taglib uri="http://java.sun.com/jsf/core" prefix="f" %>

            

            <f:view>

            <html>

    
            <head><title>jsf h:column example</title></head>

            

    
            <body>

         
            <h:dataTable border="1">

         
            <f:facet name="header">

             
            <h:outputText value="This is header."/>

         
            </f:facet>

         
            <h:column>

             
            <f:facet name="header">

                  
            <h:outputText value="Student"/>

             
            </f:facet>

         
            </h:column>

         
            <h:column>

             
            <f:facet name="header">

                  
            <h:outputText value="Marks" />

              
            </f:facet>

         
            </h:column>

         
            <h:column>

             
            <f:facet name="header">

                  
            <h:outputText value="Percent" />

             
            </f:facet>

         
            </h:column>

         
            <f:facet name="footer">

              
            <h:outputText value="This is footer."/>

         
            </f:facet>

         
            </h:dataTable>

    
            </body>

            </html>

            </f:view>

Rendered Output:

HTML Source Code:

<html>
     <head><title>jsf h:column example</title></head>

     <body>
	  <table border="1">
          <thead>
                <tr><th colspan="3" scope="colgroup">This is header.</th></tr>
                <tr>
                    <th scope="col">Student</th>
                    <th scope="col">Marks</th>
                    <th scope="col">Percent</th>
                </tr>
          </thead>
          <tfoot>
                <tr><td colspan="3">This is footer.</td></tr>
          </tfoot>
          <tbody>
          </tbody>
          </table>
     </body>
</html>

JSF column tag has some attribute for different purposes. These attributes are explained below:

rendered: This is an attribute of the column tag that is optional. This attribute can hold String typed value. This attribute value indicates that the component should be rendered during the rendering period.

binding: This attribute is also optional and take a String typed value. Specified value is linked with the backing bean through the attribute of the tag.

id: This attribute of the column tag is specified only for identification of the specific tag.

Current Comments

7 comments so far (post your own) View All Comments Latest 10 Comments:

In every example try to give faces.config.xml file also..It will be very helpful also.It will solve all of the doubts of readers.

Posted by GURUPRASAD on Wednesday, 10.29.08 @ 17:54pm | #81395

View This Comment Separately

hi can we create the data-table dynamically in jsf

Posted by jai on Friday, 01.11.08 @ 18:35pm | #44988

View This Comment Separately

hi every body how ru today?

Posted by bijay on Thursday, 12.20.07 @ 11:37am | #43078

View This Comment Separately

You can use a
<h:panelGrid columns="3">
<h:column>
<f:facet name="header">
<h:outputText value="Student"/>
</f:facet>
<h:outputText value="#{item.stname}" />
</h:column>
</h:panelGrid>

It means that you show 3 values each column, when you show the third, it is at next row

Posted by Mario on Thursday, 11.15.07 @ 21:27pm | #37515

View This Comment Separately

Hi,
My problem is Create the data and Retreve the data from data base in the table row's and column's plz help me
Thanks,
vinay

Posted by vinay on Thursday, 06.14.07 @ 12:51pm | #19189

View This Comment Separately

Hi balan,
Hence, datatable is used for the retrieving value dynamically. So, You can use the following code for getting values from the Bean class for the the specified column i.e. mentioned inside the facet tag.

<h:column>
<f:facet name="header">
<h:outputText value="Student"/>
</f:facet>
<h:outputText value="#{item.stname}" />
</h:column>

This code will automatically generate multiple rows for the values of the stname variable is of the bean class.

Thanks & Regards
Chandan Kumar Verma
Roseindia Member

Posted by chandan on Tuesday, 06.5.07 @ 12:36pm | #18265

View This Comment Separately

Hi ,

How can we create a new rows using <h:datatable> .

Please help me out.

Rgds,
balan

Posted by balan on Saturday, 06.2.07 @ 20:19pm | #18037

View This Comment Separately