Показывать всплывающую подсказку при наведении мыши на столбец заголовка dataTable

Как отобразить всплывающую подсказку для заголовка динамической таблицы p: dataTable при наведении мыши на заголовок для отображения всего заголовка столбца заголовка.

<p:dataTable id="detailDataTable" widgetVar="detailWidgetVar"
 value="#{model.elements}" var="element"

paginator="false" resizableColumns="false" scrollWidth="100%"
 scrollable= "true" emptyMessage="Aucun résultat"
styleClass="tableResultat" rowStyleClass="">
<p:columns value="#{model.columns}" var="column" columnIndexVar="colIndex"
headerText="#{column.header}"
styleClass="#{column.styleClass}" width="#{column.width}"
sortBy="#{(element[column.productId])[column.property]}">
<h:outputText value="#{(element[column.productId])[column.property]}"
title="#{(element[column.productId])[column.property]}"/>
                        </p:columns>
                    </p:dataTable>

1 ответов


можно использовать Глобальная Подсказка Primefaces; вам просто нужно изменить свой подход к настройке текста заголовка, используя <f:facet/>, а не . Использование примера кода

   <p:tooltip/>

   <p:columns value="#{model.columns}" var="column" columnIndexVar="colIndex"
        headerText= styleClass="#{column.styleClass}" width="#column.width}" sortBy="#{(element[column.productId])[column.property]}">
     <f:facet name="header">
          <h:outputText value="#{column.header}" title="#{column.header}"/>
     </f:facet>
        <h:outputText value="#{(element[column.productId])[column.property]}" title="#{(element[column.productId])[column.property]}"/>
   </p:columns>

случилось две вещи

  1. я определил глобальный <p:tooltip/>
  2. использование HTML-стандарта title атрибут в тексте фасета заголовка. Это то, что подключается к глобальной всплывающей подсказке, чтобы отобразить текст подсказки на колонка