datatable without header

[marcelocaser]

Hi,

I need <p:dataTable /> without header. What is the easy way to do this ?

thank you

[mert.sincan]

Which header? the column header of Datatable ??

[marcelocaser]

Yess, column header!! I need not show!!

[mert.sincan]

Please try with;

For only one datatable;

Code: Select all

.noHeader.ui-datatable table thead tr {
    display: none;
}

<p:dataTable styleClass="noHeader" ..>

For all Datatable;

Code: Select all

.ui-datatable table thead tr {
    display: none;
}

[marcelocaser]

Hi,

I created new css file and put the above code , but it worked . No changes.

[mert.sincan]

I tested this issue with my css code. it works fine. Please check your style on firebug of the browser.
My test code (in datatable.xhtml);

Code: Select all

<p:dataTable styleClass="noHeader" id="singleDT" var="car" value="#{dtSelectionView.cars7}" selectionMode="single" selection="#{dtSelectionView.selectedCar}" rowKey="#{car.id}"
             rows="10" paginator="true" paginatorTemplate="{CurrentPageReport}  {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}"
             rowsPerPageTemplate="5,10,15" emptyMessage="No cars found with given criteria" reflow="true">

    <p:column headerText="Id" sortBy="#{car.id}">
        <h:outputText value="#{car.id}" />
    </p:column>
    <p:column headerText="Year" sortBy="#{car.year}">
        <h:outputText value="#{car.year}" />
    </p:column>
    <p:column headerText="Brand" sortBy="#{car.brand}">
        <h:outputText value="#{car.brand}" />
    </p:column>
    <p:column headerText="Color" sortBy="#{car.color}">
        <h:outputText value="#{car.color}" />
    </p:column>
</p:dataTable>

My css code(test.css);

Code: Select all

.noHeader.ui-datatable table thead tr {
    display: none;
}

My Screenshot;

[marcelocaser]

Ok. It worked.

Thank you again!

[mert.sincan]

Glad to hear, thanks !