hide primefaces Tabelle Spaltenkopf

Question

Ich habe eine p: treeTable und die Bauminhalte sind alle in einer Spalte. Die Struktur ist eine gemeinsame Komponente, so dass einige meiner Seiten Spaltenüberschriften benötigen und andere nicht. Auf den Seiten, auf denen der columnHeader leer ist, erstellt er eine leere Zeile für die Spaltenüberschrift, die ich nicht haben möchte. Ich möchte den Spalteninhalt, nur nicht die Überschrift, wenn es keine Spaltenüberschrift gibt.

Wie kann ich das beheben? Alle Hinweise/Ideen wären großartig. Vielen Dank!

Answer 1

können Sie gelöst, dass mit benutzerdefinierten CSS durch das thead Anzeigeattribut zu keiner Einstellung:

Beispiel:

div[id="testForm:first"] thead { 
    display:none; 
} 

wenn Ihr JSF ist ähnlich wie diese:

<h:form id="testForm"> 
    <p:dataTable id="first"> 
     ... 
    <p:/dataTable> 
</h:form> 

Answer 2

Sie können Finden Sie, dass Sie spezifischer mit Ihrem Stil-Wähler sein müssen:

div[id$="myTableId"]>div>table>thead { display:none; } 

Dadurch entfällt auch die Notwendigkeit, auf Ihre Formular-ID zu verweisen. Das '$' beginnt mit der Wildcard und das '>' sagt nur direkte Kinder aus. Eine wirklich gute CSS Selector Referenz finden Sie unter http://www.w3schools.com/cssref/css_selectors.asp.

Answer 3

Eine formale Lösung:

TAG:

<p:treeTable styleClass="tree-table-no-header"> 

Stil:

.tree-table-no-header thead { 
    display: none; 
} 

Answer 4

Wenn Ihr <p:dataTable> verwendet Spalten Breiten wie diese

<p:dataTable styleClass="myTable"> 
    <p:column width="100"> 

und Sie u se die folgende CSS die Spaltenüberschriften

.myTable thead { 
    display:none; 
} 

Sie auch verlieren die Spaltenbreiten Sie

---

Lösung gesetzt zu verstecken, um Spaltenkopf zu verstecken und Spalte halten Breiten

.myTable thead th { 
    border: none !important; 
    background: none !important; 
} 

Answer 5

ausblenden Kopf (wie andere Antworten):

.hide-table-header thead { 
    display: none; 
} 

... und geben Sie die Spaltenbreite:

<p:dataTable styleClass="hide-table-header"> 
     <p:column style="width: 80px"> 

Diese werden mit Reflow = "true" Tabellen nicht.

Für mich die Grenze: keine, Hintergrund: keine Anregung lässt einen leeren Raum über dem Tisch und verbirgt auch die linke Seite des Tisches.

Answer 6

Fügen Sie diesen Code in Ihre css3 Datei

** Remove the header from the dataTable**/ 
.ui-datatable.borderless thead { 
    display: none; 
} 

/** Remove the border from the dataTable **/ 
.ui-datatable.borderless tbody, 
.ui-datatable.borderless tbody tr, 
.ui-datatable.borderless tbody td { 
    border-style: none; 
    } 

Sie dann diesen Code aufrufen aus der xhtml-Datei wie folgt:

<p:dataTable styleClass="borderless">