h:panelGrid отображает пустые ячейки таблицы

Question

У меня есть следующее <h:panelGrid>:

   <h:panelGrid columns="2" id="panelGrid" > 
        <!-- heading -->
        <f:facet name="header">
            User Details
        </f:facet>

        <h:outputLabel value="#{bundle.ViewUserdetailsLabel_id}"/>
        <!-- adding in a small effect here that will fade a message when a user hovers over the id number or username -->
        <h:outputLink id="id1" value="#">  
            <h:outputText id="id" value="#{userdetailsController.selected.id}" title="#{bundle.ViewUserdetailsTitle_id}"/> 
        </h:outputLink>                            

        <p:tooltip for="id" value="This is your I.D. Number" showEffect="fade" hideEffect="fade" />
        <h:outputText value="#{bundle.ViewUserdetailsLabel_username}"/>
        <h:outputLink id="username1" value="#">  
            <h:outputText id="username" value="#{userdetailsController.selected.username}" title="#{bundle.ViewUserdetailsTitle_username}"/>
        </h:outputLink>                            
        <p:tooltip for="username" value="Your registered username, this can be changed" showEffect="fade" hideEffect="fade" />

        <f:facet name="footer"></f:facet>  

    </h:panelGrid>

Я ожидал, что это будет отображаться как

Данные пользователя
Id:          500
Имя пользователя: zzzzzzzz

Однако вместо этого он отображается с пустыми ячейками:

Данные пользователя
             Я бы:
             500
             Имя пользователя:
zzzzzzzz

Та же проблема сохраняется при использовании <p:panelGrid> вместо <h:panelGrid>, Как это вызвано и как я могу справиться с этим?

Answer 1

В сетке панели каждый непосредственный дочерний компонент считается отдельной ячейкой таблицы.

Те <!-- heading --> а также <!-- adding ... --> каждая строка комментария считается одним ребенком. Таким образом, каждый из них также считается отдельной ячейкой таблицы.

Чтобы решить эту проблему, просто скажите Facelets, чтобы пропустить все комментарии во время создания представления следующим web.xml запись:

<context-param>
    <param-name>javax.faces.FACELETS_SKIP_COMMENTS</param-name>
    <param-value>true</param-value>
</context-param>

Тогда есть <p:tooltip> которая также считается отдельной ячейкой таблицы, даже если она не представляет непосредственное содержимое. Вам нужно обернуть всплывающую подсказку и ее целевой компонент в <h:panelGroup> так, чтобы она представляла одну ячейку таблицы (кроме того, вы могли бы также просто поместить туда комментарий).

<h:outputLabel value="#{bundle.ViewUserdetailsLabel_id}"/>
<h:panelGroup>
    <!-- adding in a small effect here that will fade a message when a user hovers over the id number or username -->
    <h:outputLink id="id1" value="#">  
        <h:outputText id="id" value="#{userdetailsController.selected.id}" title="#{bundle.ViewUserdetailsTitle_id}"/> 
    </h:outputLink>                            
    <p:tooltip for="id" value="This is your I.D. Number" showEffect="fade" hideEffect="fade" />
</h:panelGroup>

<h:outputText value="#{bundle.ViewUserdetailsLabel_username}"/>
<h:panelGroup>
    <h:outputLink id="username1" value="#">  
        <h:outputText id="username" value="#{userdetailsController.selected.username}" title="#{bundle.ViewUserdetailsTitle_username}"/>
    </h:outputLink>                            
    <p:tooltip for="username" value="Your registered username, this can be changed" showEffect="fade" hideEffect="fade" />
</h:panelGroup>