如何在JSF <h:panelGrid>
中设置colspan
和rowspan
?如何在JSF panelGrid中设置colspan和rowspan?
回答
这两种标准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>
。
- Tomahawk具有
我同意BalusC答案,并要补充一点,如果你使用它的p:dataTable组件Primefaces JSF2组件库还提供了这个功能。它在那里被称为分组。
假设
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 ..
五,
不是我会做事情的方式。即使它可能回答这个问题,也请尝试教育。不好的做法是..好..不好。 :) – 2012-11-22 14:41:10
用途:富:列的colspan="2"
RichFaces的
<rich:column colspan="2">
<h:outputText value="Ingrese el texto de la imagen" />
</rich:column>
这个问题是关于JSF而不是richfaces – specializt 2016-01-19 13:44:43
自24个januari 2012 Primefaces也有使用合并单元格和行跨度在Primefaces的panelGrid中组件的可能性。请参阅:
有没有办法来定义面板网格列跨度,但如果使用得当你可以把它仅仅只是简单的标签发生。我想向你展示一个例子。
<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跨越两列给了它需要的尺寸。
- 1. 如何标题rowspan和colspan?
- 2. GridView与colspan和rowSpan
- 3. QGridLayout与colspan和rowspan
- 4. CellTable中的Colspan和Rowspan
- 5. Rowspan/colspan问题
- 6. html colspan rowspan
- 7. colspan和在css 2.1中的rowspan?
- 8. rowspan和colspan不能在Chrome中工作
- 9. primefaces panelgrid colspan不工作
- 10. 如何在HTML表格中使用colspan和rowspan?
- 11. 如何在html中使用colspan和rowspan表?
- 12. HTML表和rowspan和colspan行为
- 13. Sorting panelgrid JSF
- 14. DIV&CSS如何与Rowspan&Colspan合作?
- 15. 使用rowspan和colspan解析表
- 16. HTML表rowspan或colspan问题?
- 17. Slickgrid的头部的Colspan&rowspan
- 18. jsPDF AutoTable rowspan/colspan from HTML table
- 19. Vaadin表| |如何设置colspan
- 20. 如何在kendo ui angular 2中做colspan/rowspan?
- 21. 如何在html中使用colspan,rowspan或css创建表格?
- 22. 如何动态生成PanelGrid行? (JSF,Primefaces)
- 23. 我们可以在displaytag中使用rowspan和colspan吗?
- 24. 从表格和Colspan RowSpan中克隆行和列
- 25. 如何在Pdf中创建带有rowspan和colspan功能的表格
- 26. AngularJS:表colspan rowspan动态计算
- 27. 在将“Table”转换为“Div”时处理rowspan和colspan
- 28. 如何设置gwt上的rowspan和colspan值包含小部件的网格单元格?
- 29. JSF渲染一个SelectOneRadio与panelGrid中
- 30. PanelGrid中的多个JSF组件
您是否尝试过使用colspan的panelgrid中的rich:column?因为doc说:“colspan”,“rowspan”和“breakbefore”属性仅影响中的列,而不影响中的列。 –
2010-10-13 16:14:28