Sorting <tc:sheet>

Sorting can be enable via the sortable attribute in the <tc:column/>. A custom sorting implementation can be set in the sortActionListener attribute in the <tc:sheet/>.

It's important to have a component inside the <tc:column/>, e. g. <tc:out value="#{object.name}"/>. If there is only a fragment like #{object.name}, sorting will not be possible!

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

Basics

In this example, the sortable attribute is 'true' for all columns. Notice, that there are negative periods.

<tc:column label="Name" sortable="true">
Name Period (Days) Discovery Year
Sun 0.0
Mercury 87.97
Venus 224.7
Earth 365.26
  • Rows 1 to 4 of 88
  • Page 1 of 22

Custom Sorting

All columns in this sheet can be sorted. A custom sorting implementation is set. Now, the sign for period numbers is ignored by sorting.

<tc:sheet value="#{sheetController.solarList}"
    var="solarobject" rows="4"
    sortActionListener="#{sheetController.sheetSorter}">
      <tc:column id="namecol" label="Name" sortable="true">
      ...
    
Name Period (Days) Discovery Year
Sun 0.0
Mercury 87.97
Venus 224.7
Earth 365.26
  • Rows 1 to 4 of 88
  • Page 1 of 22
<?xml version="1.0" encoding="UTF-8"?> <!-- * Licensed to the Apache Software Foundation (ASF) under one or more * contributor license agreements. See the NOTICE file distributed with * this work for additional information regarding copyright ownership. * The ASF licenses this file to You under the Apache License, Version 2.0 * (the "License"); you may not use this file except in compliance with * the License. You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. --> <ui:composition template="/main.xhtml" xmlns="http://www.w3.org/1999/xhtml" xmlns:tc="http://myfaces.apache.org/tobago/component" xmlns:ui="http://java.sun.com/jsf/facelets"> <ui:param name="title" value="#{demoBundle.sheet_sorting} &lt;tc:sheet>"/> <p>Sorting can be enable via the <code>sortable</code> attribute in the <code class="language-markup">&lt;tc:column/></code>. A custom sorting implementation can be set in the <code>sortActionListener</code> attribute in the <code class="language-markup">&lt;tc:sheet/></code>.</p> <p>It's important to have a component inside the <code class="language-markup">&lt;tc:column/></code>, e. g. <code class="language-markup">&lt;tc:out value="\#{object.name}"/></code>. If there is only a fragment like <code class="language-markup">\#{object.name}</code>, sorting will not be possible!</p> <p>Tag Library Documentation: <tc:link label="&lt;tc:sheet/>" image="#{request.contextPath}/image/feather-leaf.png" link="#{demoBundle.tagDocUrl}/#{apiController.currentRelease}/tld/tc/sheet.html"/> | <tc:link label="&lt;tc:column/>" image="#{request.contextPath}/image/feather-leaf.png" link="#{demoBundle.tagDocUrl}/#{apiController.currentRelease}/tld/tc/column.html"/></p> <tc:section label="Basics"> <p>In this example, the <code>sortable</code> attribute is 'true' for all columns. Notice, that there are negative periods.</p> <pre><code class="language-markup">&lt;tc:column label="Name" sortable="true"></code></pre> <tc:sheet id="s1" value="#{sheetSortingController.solarList}" var="object" rows="4" markup="small"> <tc:column id="columnName" label="Name" sortable="true"> <tc:out value="#{object.name}" labelLayout="skip"/> </tc:column> <tc:column id="columnPeriod" label="Period (Days)" sortable="true"> <tc:out value="#{object.period}" labelLayout="skip"/> </tc:column> <tc:column id="columnDistance" label="Distance" sortable="true" rendered="false"> <tc:out value="#{object.distance}" labelLayout="skip"/> </tc:column> <tc:column id="columnDiscoverYear" label="Discovery Year" sortable="true"> <tc:out value="#{object.discoverYear}" labelLayout="skip"/> </tc:column> </tc:sheet> </tc:section> <tc:section label="Custom Sorting"> <p>All columns in this sheet can be sorted. A custom sorting implementation is set. Now, the sign for period numbers is ignored by sorting.</p> <pre><code class="language-markup">&lt;tc:sheet value="\#{sheetController.solarList}" var="solarobject" rows="4" sortActionListener="\#{sheetController.sheetSorter}"> &lt;tc:column id="namecol" label="Name" sortable="true"> ... </code></pre> <tc:sheet id="s2" value="#{sheetSortingController.solarList}" var="object" rows="4" sortActionListener="#{sheetSortingController.sheetSorter}" markup="small"> <tc:column id="customColumnName" label="Name" sortable="true"> <tc:out value="#{object.name}" labelLayout="skip"/> </tc:column> <tc:column id="customColumnPeriod" label="Period (Days)" sortable="true"> <tc:out value="#{object.period}" labelLayout="skip"/> </tc:column> <tc:column id="customColumnDistance" label="Period (Days)" sortable="true" rendered="false"> <tc:out value="#{object.period}" labelLayout="skip"/> </tc:column> <tc:column id="customColumnYear" label="Discovery Year" sortable="true"> <tc:out value="#{object.discoverYear}" labelLayout="skip"/> </tc:column> </tc:sheet> </tc:section> </ui:composition>