скрывать основе схемы PrimeFaces заголовок столбца таблицы

У меня есть p: treeTable и содержимое дерева находятся в одном столбце. Дерево является общим компонентом, поэтому некоторые из моих страниц требуют заголовка столбца, а некоторые-нет. На страницах, где columnHeader пуст, он создает пустую строку для заголовка столбца, чего я не хочу. Мне нужно содержимое столбца, а не заголовок, когда нет заголовка столбца.

Как я могу это исправить? Любые указатели / идеи были бы великолепны. Спасибо!

8
columnheader hide primefaces treetable

6 ответов

вы можете решить это с помощью пользовательского CSS, установив атрибут отображения thead в none:

пример:

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

Если ваш JSF похож на это:

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

более формальное решение:

TAG:

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

стиль:

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

если <p:dataTable> использует столбцы Ширин такой

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

и вы используете следующий CSS, чтобы скрыть заголовки столбцов

.myTable thead {
    display:none;
}

вы также потеряете ширину столбца, которую вы установили

решение скрыть заголовок столбца и сохранить ширину столбца

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

вы можете найти, что вам нужно быть более конкретным с вашим селектором стиля:

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

Это также устраняет необходимость ссылаться на идентификатор формы. "$"Начинается с wild card, а" > " говорит, что выберите только прямые дети. См.http://www.w3schools.com/cssref/css_selectors.asp для действительно хорошей ссылки селектора CSS.

1

скрыть заголовок (так же как и другие ответы):

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

... и укажите ширину столбца:

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

Они не будут работать с таблицами reflow="true".

для меня граница: нет, фон: ни одно предложение не оставляет пустого места над столом и скрывает левую боковую границу таблицы.

1

добавьте этот код в файл css3 

** 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;
    }

затем вызовите этот код из файла xhtml следующим образом:

<p:dataTable styleClass="borderless">
0