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

如何在JSF

中设置

colspan

和

rowspan

？

在标准JSF实现中，两者都不可能。有3种方法可以解决此问题：

自己编写简单的HTML。

基本上呈现HTML

。做同样的事

创建支持此功能的自定义HTML呈现程序。然而，这将是大量的汗水和疼痛

使用支持此功能的第三方组件库。

• 具有支持
  中的

  colspan

  的组件
• （仅限3.x）的组件支持中的

  colspan

  和

  rowspan

• 在和中都支持的
  旁边有一个

---

我同意BalusC的回答，并想补充一点，如果您使用其组件，Primefaces JSF2组件库也提供此功能。这里称为分组。

假设

包含两个条目的消息资源文件：

key.row=

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>

你好

打印包含3行的表：

r1-c1、r1-c2、r1-c3

3个空白单元格

一种单元对齐的中心，具有colspan 3并包含hello div

---

使用：rich:column

colspan=“2”

ofRichFaces

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

---

自2012年1月24日起，Primefaces还可以在Primefaces的panelGrid组件中使用colspan和rowspan。见：

---

无法在配电盘格线中定义柱跨度，但如果使用得当，只需使用普通标记即可实现。我想给大家举一个例子

<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根据所需的大小跨越两列。

您是否尝试过使用colspan的panelgrid中的rich:列？因为文档中说：“colspan”、“rowspan”和“breakbefore”属性只影响a中的列，而不影响a中的列。”我也不会这样做。即使它可能回答这个问题，也请尝试教育。坏习惯是。。好。。坏的。：）这个问题是关于JSF而不是richfaces的