Tobago Demo

Menu

Root Dummy Intro Search Getting Started Docker What's New Migration Compatibility FAQ API Download Server Info Logging Info In Suggest Textarea Date Range Group 5 Star Rating File Upload Out Label Badge Image Figure Progress Object Checkbox Toggle Dropdown Radio Listbox SelectOneList Multi Checkbox Multi Listbox Shuttle SelectManyList Button and Link Default Command Button Group Customizer Link Group Box Panel Separator Section Header and Footer Bar Popup Popover Toast Basic example Tab Client Tab Ajax Tab Server Basic example Sheet Sorting Paginator Sheet Column Selector Sheet Selectionchange Sheet Event Sheet Action Sheet Markup Sheet Style Empty Sheet Column Bar Sheet Filter Sheet Static Header Sheet Multi Header Sheet Tree Column Panel Sheet Editable Sheet Lazy Sheet Nested Basic example Tree Command Types Tree Select Tree Editor Tree Menu Tree Listbox Intro TinyMCE CKEditor Flow Layout Flex Layout Segment Layout Label Layout Grid Layout Split Layout Message-layout Overview Collapsible Box Collapsible Popup Collapsible Panel Collapsible Section Content Validation JSR 303 Severity Messages Content Security Policy Sanitize Roles Form AccessKey Focus Exception Handler Style Tag Bootstrap Theme Icons Partial Ajax Behavior WebSocket Transition Non Faces Request Conversion Error Handling For Each ConversationScoped Download Configuration Format Locale DataAttribute Meta
Root Dummy Intro Search Getting Started Docker What's New Migration Compatibility FAQ API Download Server Info Logging Info In Suggest Textarea Date Range Group 5 Star Rating File Upload Out Label Badge Image Figure Progress Object Checkbox Toggle Dropdown Radio Listbox SelectOneList Multi Checkbox Multi Listbox Shuttle SelectManyList Button and Link Default Command Button Group Customizer Link Group Box Panel Separator Section Header and Footer Bar Popup Popover Toast Basic example Tab Client Tab Ajax Tab Server Basic example Sheet Sorting Paginator Sheet Column Selector Sheet Selectionchange Sheet Event Sheet Action Sheet Markup Sheet Style Empty Sheet Column Bar Sheet Filter Sheet Static Header Sheet Multi Header Sheet Tree Column Panel Sheet Editable Sheet Lazy Sheet Nested Basic example Tree Command Types Tree Select Tree Editor Tree Menu Tree Listbox Intro TinyMCE CKEditor Flow Layout Flex Layout Segment Layout Label Layout Grid Layout Split Layout Message-layout Overview Collapsible Box Collapsible Popup Collapsible Panel Collapsible Section Content Validation JSR 303 Severity Messages Content Security Policy Sanitize Roles Form AccessKey Focus Exception Handler Style Tag Bootstrap Theme Icons Partial Ajax Behavior WebSocket Transition Non Faces Request Conversion Error Handling For Each ConversationScoped Download Configuration Format Locale DataAttribute Meta

Sheet Static Header

There are several ways to display the header. For simple column headers, use the attribute label of <tc:column>. For more complex header which span over columns and/or rows please go to the Sheet Multi Header section.

Tag Library Documentation: <tc:sheet/> | <tc:column/>

Basics

A sheet with six rows. The name of the columns is set by the label attribute.

<tc:sheet value="#{sheetController.solarList}" var="object" rows="6"> <tc:column label="Name"> <tc:out value="#{object.name}"/> ...
Name Orbit Period (Days) Discoverer Year
Sun - 0.0 -
Mercury Sun 87.97 -
Venus Sun 224.7 -
Earth Sun 365.26 -
Mars Sun 686.98 -
Jupiter Sun 4332.71 -
Rows 1 to 6 of 88
  • Page 1 of 15

Scrolling Header

A sheet with ten rows and a maximal height of 500px. The header is scrollable.

To get a scrolling header, you have to set a maximal height and the width of all columns must be calculated automatically.

<tc:sheet value="#{sheetController.solarList}" var="object" rows="10"> <tc:style maxHeight="500px"/> ...
Name Orbit Period (Days) Discoverer Year
Sun - 0.0 -
Mercury Sun 87.97 -
Venus Sun 224.7 -
Earth Sun 365.26 -
Mars Sun 686.98 -
Jupiter Sun 4332.71 -
Saturn Sun 10759.5 -
Uranus Sun 30685.0 Herschel 1781
Neptune Sun 60190.0 Adams 1846
Pluto Sun 90800.0 Tombaugh 1930
Rows 1 to 10 of 88
  • Page 1 of 9

Header always visible

A sheet with ten rows and a maximal height of 500px. The header is static.

To get a static header, you have to set a maximal height and the columns attribute must be used to set the width of the columns manually.

<tc:sheet value="#{sheetController.solarList}" var="object" rows="10" columns="3fr 80px 20% 2fr 1fr"> <tc:style maxHeight="500px"/> ...
Name    Orbit    Period (Days)    Discoverer    Year   
Sun - 0.0 -
Mercury Sun 87.97 -
Venus Sun 224.7 -
Earth Sun 365.26 -
Mars Sun 686.98 -
Jupiter Sun 4332.71 -
Saturn Sun 10759.5 -
Uranus Sun 30685.0 Herschel 1781
Neptune Sun 60190.0 Adams 1846
Pluto Sun 90800.0 Tombaugh 1930
Rows 1 to 10 of 88
  • Page 1 of 9
© 2005-2025 Apache Software Foundation, Licensed under the Apache License, Version 2.0.