webentwicklung-frage-antwort-db.com.de

Wie man Colspan und Rowspan in JSF PanelGrid setzt?

Wie kann ich in JSF <h:panelGrid>colspan und rowspan einstellen?

58
Hari kanna

Mit der Standard-JSF-Implementierung ist keines von beiden möglich. Es gibt drei Möglichkeiten, dies zu beheben:

  1. Schreiben Sie einfach HTML. Ein <h:panelGrid> gibt grundsätzlich einen HTML <table> wieder. Das Gleiche tun.
  2. Erstellen Sie einen benutzerdefinierten HTML-Renderer, der dies unterstützt. Es wird jedoch viel Schweiß und Schmerzen geben.
  3. Verwenden Sie eine Komponentenbibliothek eines Drittanbieters, die dies unterstützt .
56
BalusC

Seit dem 24. Januar 2012 hat Primefaces auch die Möglichkeit, Colspan und Rowspan in der Komponente panelGrid von Primefaces zu verwenden. Sehen:

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

8
Renso Lohuis

Verwenden Sie: rich: column colspan="2" von RichFaces

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

annehmen 

a) eine Nachrichtenressourcendatei mit zwei Einträgen: 
key.row =</ td> </ tr> <tr> <td (Leerzeichen ignorieren)
key.gt =>

b) Zeile.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>

dann zum beispiel

<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> 


druckt eine Tabelle mit 3 Zeilen: 

1) r1-c1, r1-c2, r1-c3

2) 3 leere Zellen

3) ein zellausgerichtetes Zentrum mit Colspan 3 und einem Hallo-Div.

V.

2
V. Petropoulos

Ich stimme mit der Antwort von BalusC überein und möchte hinzufügen, dass die Komponentenbibliothek Primefaces JSF2 diese Funktionalität auch bietet, wenn Sie ihre p: dataTable - Komponente verwenden. Man nennt es dort Gruppierung.

1
alfonx

Es gibt keine Möglichkeit, die Spaltenspanne im Panel-Raster zu definieren. Wenn Sie sie jedoch sinnvoll einsetzen, können Sie dies nur durch einfaches Tag realisieren. Ein Beispiel möchte ich Ihnen zeigen.

<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>

Bitte beachten Sie, dass button5 bei der benötigten Größe zwei Spalten umfasst.

0