How to let <f:facet> contain multiple components? It shows only the first

Question

I use <f:facet> to create a table header and I want a symbol beside it. However, it doesn't seem to work well. The symbol is not rendered.

JSF:

<h:column id="subject_column">
  <f:facet name="header">
    <h:commandLink value="Subject" id="sort_by_subjects"
                   action="#{xxx.sort}">
      <f:param id="sortBySubject" name="sortBy" value="SUBJECT"/>
    </h:commandLink>
    <span>${isAscending}</span>
  </f:facet>
  <h:outputText value="#{email.emailSubject}"/>
</h:column>

${isAscending} contains the arrow symbol ↑ and represents the order. I would like to show it beside <h:commandLink>.

Answer 1

The <f:facet> can have only one child. Wrap multiple children in a <h:panelGroup>.

<h:column>
    <f:facet name="header">
        <h:panelGroup>
            <h:commandLink ... />
            <h:outputText ... />
        </h:panelGroup>
    </f:facet>
    ...
</h:column>

Answer 2

The <f:facet> can have only one child. Wrap it in a <h:panelGroup> or <h:panelGrid>.