Search code examples
jsfprimefacescomposite-component

How to include a primeface column into a composite


I have a primefaces datatable with a lot of similar columns such as

    <p:column filterBy="#{element.value}" filterFunction="#{applicationHelperController.filterByNumber}" styleClass="ps-90-header" >
        <f:facet name="header">
            <p:tooltip for="@next" value="Some header tooltip"/>
            <h:outputText id="#{header}_id" value="Some header" styleClass="ps-90-header" />
        </f:facet>
        <h:outputText value="#{element.value}" />
    </p:column> 

Is there a way of creating a composite for it such as to write

<mine:column value="#{element.value}" header="Some header" headerTooltip="Some header tooltip" />

I've been searching/trying things for a day now without any real success. I've managed to use an <ui:include...> with params but it's almost as verbose as the original

    <ui:include src="/WEB-INF/includes/countColumn.xhtml" >
        <ui:param name="value" value="#{element.value}"/>
        <ui:param name="header" value="Some header"/>
        <ui:param name="headerTooltip" value="Some header tooltip"/>
    </ui:include>

I've tried using taglib as preconized here How to create a composite component for a datatable column? even if it uses richfaces and this solution Column as Composite Component inside DataTable but none work.

I've also read somewhere that <p:column...> should be a direct child of <p:datatable...> so it is not possible but I believe that was with old primefaces version (3 or 4).

So, does anyone know if it is possible with Primefaces 6 or 8 and if so how?


Solution

  • You can use custom Facelet tags to DRY your code.

    Simply create tags for columns like:

    <ui:composition xmlns="http://www.w3.org/1999/xhtml"
                    xmlns:ui="http://xmlns.jcp.org/jsf/facelets"
                    xmlns:p="http://primefaces.org/ui">
      <p:column ...>
        ...
      </p:column>
    </ui:composition>
    

    This is how a table looks in one of our projects:

    <dt:dataTable controller="#{controller}"
                  sortField="activationDate">
      <dt:column id="id"/>
      <dt:columnDate id="activationDate"/>
      ...
    <dt:dataTable/>