jsf primefaces datatable p:columns

datatable, jsf, primefaces

Solution

Your sort should look something like

sortBy="#{value[column.charge]}"

Take a look at the showcase example DataTable - Dynamic Columns

Change

 <p:columns
        value="#{measurementList.columns}"
        var="column"
        columnIndexVar="colIndex"
        styleClass="measurementListDatatableColumn"
        sortBy="#{column.displayName}" 
        >
        <f:facet name="header">#{column.displayName}</f:facet>
            <p:column>
                #{measurement[column.methodName]}
            </p:column>
    </p:columns>

into

 <p:columns
        value="#{measurementList.columns}"
        var="column"
        columnIndexVar="colIndex"
        styleClass="measurementListDatatableColumn"
        sortBy="#{measurement[column.methodName]}" 
        >
        <f:facet name="header">
            #{column.displayName}
        </f:facet>

         #{measurement[column.methodName]}

    </p:columns>

In general : the same EL expression that is used to display the data of the column , should be used for the `sortBy`

Problem

ive got a Primefaces DataTable like this ``` <p:dataTable value="#{valueList.value}" var="value" selection="#{valueList.selected}" id="measurementTable" paginator="true" rows="20" rowsPerPageTemplate="20,25,30,35,40"/> ``` and dynamic Columns with this ``` <p:columns value="#{valueList.columns}" var="column" columnIndexVar="colIndex" /> ``` this works fine and my Datatable looks good , but when i add ``` sortBy="#{value.charge}" ``` to `p:columns` and i was click on column to sort the css style is destroyd and ive got a List with my Data not a DataTable, this is very ugly. My code ``` <p:dataTable value="#{measurementList.measurements}" var="measurement" selection="#{measurementList.selected}" id="measurementTable" paginator="true" rows="20" rowsPerPageTemplate="20,25,30,35,40" rowKey="#{measurement.mdkFid}" emptyMessage="#{measurementList.getCapString('no_records_found')}"> <p:column selectionMode="multiple" style="width:18px" /> <p:column> <p:commandLink title="#{measurementList.getString('edit')}" update=":contentPanel"> <h:outputText styleClass="ui-icon ui-icon-pencil" /> <f:actionListener binding="#{measurementList.editSelected(measurement) }" /> <f:actionListener binding="#{navigation.goTo('/xhtml/measurements/editMeasurement.xhtml') }" /> </p:commandLink> </p:column> <p:columns value="#{measurementList.columns}" var="column" columnIndexVar="colIndex" styleClass="measurementListDatatableColumn" sortBy="#{column.displayName}" > <f:facet name="header">#{column.displayName}</f:facet> <p:column> #{measurement[column.methodName]} </p:column> </p:columns> ```

Original source