如何在JSF panelGrid中設置colspan和rowspan？

53

這兩種標準JSF實現都不可能。有3種方法可以解決此問題：

自己寫一個純HTML。 A <h:panelGrid>基本上呈現HTML <table>。照着做。
創建一個支持這個的自定義HTML渲染器。然而，它會帶來很多的汗水和痛苦。
使用支持此功能的第三方組件庫。
- Tomahawk具有<t:panelGroup>部件支持在<h:panelGrid>colspan。
- RichFaces（僅限3.x）具有<rich:column>組件，它支持colspan和rowspan的<rich:dataTable>。
- PrimeFaces在和<p:dataTable>（也與<p:columnGroup>）都支持<p:column>旁邊有一個<p:row>。

來源

2010-06-24 15:17:37 BalusC

+7

您是否嘗試過使用colspan的panelgrid中的rich：column？因爲doc說：「colspan」，「rowspan」和「breakbefore」屬性僅影響中的列，而不影響中的列。 – 2010-10-13 16:14:28

1

我同意BalusC答案，並要補充一點，如果你使用它的p:dataTable組件Primefaces JSF2組件庫還提供了這個功能。它在那裏被稱爲分組。

來源

2010-09-20 09:32:21 alfonx

1

假設

a）用兩個條目的消息資源的文件：
key.row = </TD> </TR> < TR> < TD（忽略空格）
key.gt = >

b）中row.xhtml

<ui:composition 
    xmlns="http://www.w3.org/1999/xhtml" 
    xmlns:ui="http://java.sun.com/jsf/facelets" 
    xmlns:h="http://java.sun.com/jsf/html" 
    xmlns:f="http://java.sun.com/jsf/core" 
    xmlns:c="http://java.sun.com/jsp/jstl/core" > 

    <c:forEach begin="0" end="#{colspan-2}"> 
     <h:panelGroup /> 
    </c:forEach> 

    <h:panelGroup> 
     <h:outputText value="#{i18n['key.row']}" escape="false" /> 
     <h:outputText value=" colspan='#{colspan}' #{cellAttributes}" /> 
     <h:outputText value="#{i18n['key.gt']}" escape="false" /> 

     <ui:insert /> 
    </h:panelGroup> 

</ui:composition>

然後，例如

<h:panelGrid columns="3"> 
    <h:outputText value="r1-c1" /> 
    <h:outputText value="r1-c2" /> 
    <h:outputText value="r1-c3" /> 

    <ui:decorate template="/row.xhtml"> 
    <ui:param name="colspan" value="3" /> 
    <ui:param name="cellAttributes" value=" align='center'" /> 

    <div>Hello!!!!!</div> 
    </ui:decorate> 
</h:panelGroup>

打印一個表3行：

1）R1-C1，R1-C2，R1-C3

2）3空白細胞

3）一個細胞對齊的中心，具有colspan 3，幷包含一個你好div ..

五，

來源

2011-05-10 16:28:00

+3

不是我會做事情的方式。即使它可能回答這個問題，也請嘗試教育。不好的做法是..好..不好。 :) – 2012-11-22 14:41:10

2

用途：富：列的colspan="2" RichFaces的

<rich:column colspan="2">       
<h:outputText value="Ingrese el texto de la imagen" /> 
</rich:column>

來源

2011-06-15 20:06:57 dmotta

+0

這個問題是關於JSF而不是richfaces – specializt 2016-01-19 13:44:43

8

自24個januari 2012 Primefaces也有使用合併單元格和行跨度在Primefaces的panelGrid中組件的可能性。請參閱：

http://www.primefaces.org/showcase/ui/panel/panelGrid.xhtml

來源

2012-02-13 09:42:22

0

有沒有辦法來定義面板網格列跨度，但如果使用得當你可以把它僅僅只是簡單的標籤發生。我想向你展示一個例子。

<h:panelGrid columns="1" > 
<h:panelGrid columns="2"> 
    <h:commandButton image="resources/images/Regular5.jpg" action="booking/Create.jsf?faces-redirect=truebookingType=REGULAR"> 
    </h:commandButton> 
    <h:commandButton id="button2" image="resources/images/Casual2.jpg" action="booking/Create.jsf?faces-redirect=truebookingType=CASUAL"> 
    </h:commandButton> 
</h:panelGrid> 
<h:panelGrid columns="2"> 
    <h:commandButton id="button3" image="resources/images/Instant2.jpg" action="booking/Create.jsf?faces-redirect=truebookingType=INSTANT"> 
    </h:commandButton> 
    <h:commandButton id="button4" image="resources/images/Outstation6.jpg" action="booking/Create.jsf?faces-redirect=truebookingType=OUTSTATION"> 
    </h:commandButton> 
</h:panelGrid> 
<h:commandButton id="button5" image="resources/images/ShareMyCar.jpg" action="booking/Create.jsf?faces-redirect=truebookingType=OUTSTATION"> 
</h:commandButton>

請注意，button5跨越兩列給了它需要的尺寸。

來源

2013-10-15 02:36:56

如何在JSF panelGrid中設置colspan和rowspan？

回答

相關問題