JSF 2.0 + Primefaces 2.x：數據錶行的工具提示

有沒有人知道如何在用戶將鼠標懸停在我的primefaces數據表中的行上時顯示工具提示？此外，工具提示需要顯示primefaces樹，並且在顯示工具提示之前需要加載填充樹的數據。JSF 2.0 + Primefaces 2.x：數據錶行的工具提示

我嘗試了一個簡單的P.O.C，在我的<p:column>中添加了工具提示，但工具提示僅顯示該列，我需要將鼠標直接放在要顯示的工具提示欄的文本中。我的P.O.C在工具提示中沒有樹，因爲我還沒有弄清楚那部分。

任何幫助/建議將不勝感激。

來源

2012-04-02 Justin Kredible

您可能會考慮轉移到最新版本的PrimeFaces，並開始使用overlayPanel。這將完全符合您的要求。

<p:dataTable value="#{myBean.myDetails}" var="myItem" rowIndexVar="rowIndex" > 
    <p:column> 
     <f:facet name="header"> 
      <h:outputLabel value="#"/> 
     </f:facet> 
     <h:outputLabel value="#{rowIndex}" id="myLbl"/> 

     <p:overlayPanel id="myPanel" for="myLbl" showEvent="mouseover" hideEvent="mouseout"> 
       <p:panelGrid columns="2"> 
        <f:facet name="header">Details In Tree</f:facet> 

        <h:outputLabel value="Column 1 of Table" /> 
        <h:outputLabel value="#{dataItem.Col1}" /> 

        <h:outputLabel value="Column 2 of Table" /> 
        <h:outputLabel value="#{dataItem.Col2}" /> 

       </p:panelGrid> 
      </p:overlayPanel> 
    </p:column> 
    ..... 
    ..... 
</p:dataTable>

在上面的例子中，行的數據作爲用戶移動鼠標上表中的行被顯示在標籤。我們也可以按照您的要求在overlayPanel中顯示樹。

希望這會有所幫助。

來源

2012-04-03 06:39:59 rags

由於各種原因，切換到primefaces 3目前不適合我。不過，我會接受你的回答。謝謝。 – 2012-04-03 16:23:26

這不會工作，因爲overlayPanel被行邊界「截斷」。必須在overlayPanel上添加'appendToBody =「true」'。這個問題出現在3.3中：http://forum.primefaces.org/viewtopic.php?f=3&t=23575 – Paranaix 2012-08-14 13:22:41

但它只顯示在＃{rowIndex}的文本中。你能告訴我如何顯示整行嗎？ – 2013-01-24 11:23:06

我試圖找到一個更好的解決方案，並找到了primefaces擴展的共享工具提示。

我改變了我的代碼，該解決方案的工作：

<p:dataTable var="entry" value="#{....}" styleClass="myTable"> 
    <p:column headerText="Header 1"> 
     <h:outputText value="#{entry.value1}" /> 
    </p:column> 

    <p:column headerText="Header 2"> 
     <h:outputText value="#{entry.value2}" /> 
     <pe:tooltip value="This is row number #{rowIndex}" forSelector=".myTable tr[role=row][data-ri=#{rowIndex}]" 
      shared="true" atPosition="top center" myPosition="bottom center" showDelay="500" /> 
    </p:column> 
</p:dataTable>

DataTable中需要一個styleClass，因爲提示的選擇只能匹配這個表並沒有其他表。

來源

2013-04-10 09:36:02

我嘗試使用全局工具提示時遇到了定位問題。 – 2015-08-06 14:03:15

JSF 2.0 + Primefaces 2.x：數據錶行的工具提示

回答

相關問題