Primefaces static and dynamic columns in datatable

Question

I am using Primefaces 5.0 to create a dynamic datatable.

My DataObject has some required fields and a List of optional "tupel" (key-value pair). The optional list may vary in size. Therefore I need a dynamic mechanism to show a List of DataObject in Primefaces.DataTable.

My approach looks like:

public class DataObject {
    private String staticval1;
    private String staticval2;

    private List<Tupel> optionalValues;


    // .. getter, setter, hashCode, toString.....
}

public class Tupel{
    private String id;
    private String value;
}

@ManagedBean
@ViewScoped
public class TableOverviewBean {
    private List<DataObject> data;

    @EJB
    private IMyDao myDao;

    @PostConstruct
    public void init() {
        data = myDao.findAll();
    }

    public List<DataObject> getData() {
        return data;
    }

    public void setData(List<DataObject> data) {
        this.data = data;
    }
}

    <h:form>
        <p:dataTable value="#{tableOverviewBean.data}" var="data">
            <p:column headerText="static1">
                <h:outputText value="#{data.staticval1}" />
            </p:column>

            <p:column headerText="static2">
                <h:outputText value="#{data.staticval2}" />
            </p:column>

            <p:columns value="#{data.optionalValues}" var="opt" headerText="#{opt.id}">
                <h:outputText value="#{opt.value}" />
            </p:columns>
        </p:dataTable>
    </h:form>

But this does not work. The dynamic columns are not rendered. How can I solve my problem?

EDIT: Expected result:

staticval1 | staticval2 | dynamic_id1 | dynamic_id2 | ... | dynmic_idn
----------------------------------------------------------------------
static1a   | static2a   | dyna_value1a| dyna_value2a | ... | dyna_valu3a
static1b   | static2b   | dyna_value1b| dyna_value2b | ... | dyna_valu3b
static1c   | static2c   | dyna_value1c| dyna_value2c | ... | dyna_valu3c

Answer 1

It isn't possible to define columns based on row data. Imagine that row 1 has 2 columns, row 2 has 6 columns, row 3 has 1 column, etc how would you ever produce a technically valid table in HTML? Each row must have the same amount of columns.

You've 2 options, depending on whether can change the model or not:

1. If you can't change the model, then you need to replace that <p:columns> by a single <p:column> and loop over the #{data.optionalValues} using a nested loop with e.g. <ui:repeat> or perhaps even another <p:dataTable><p:columns>:

   <p:column>
       <p:dataTable value=""><!-- Empty string as value forces 1 row. -->
           <p:columns value="#{data.optionalValues}" var="opt" headerText="#{opt.id}">
               #{opt.value}
           </p:columns>
       </p:dataTable>
   </p:column>
   

2. If you can change the model, then you need to let <p:columns value> point to a bean property instead of to a row property, so that it's exactly the same for every row. This works if you replace List<Tupel> optionalValues by Map<String, Tupel> optionalValues where the key is Tupel#id and add a List<String> property to the bean containing all available Tupel#id values.

   <p:columns value="#{tableOverviewBean.availableTupelIds}" var="id" headerText="#{id}">
       #{data.optionalValues[id].value}
   </p:columns>