Primefaces dataTable with rowspan

Sono abbastanza nuovo con JSF Primefaces 3.1. Provo a costruire una tabella "complessa" e non riesco a trovare una buona soluzione utilizzando dataTable (ho bisogno di un componente di ordinamento).Primefaces dataTable with rowspan

Vorrei costruire una tabella equivalente alla seguente rappresentazione HTML, utilizzando un POJO base del genere:

String field1 
String field2 
List<String> fields3 // 3 items 
String field4 

<table border="1"> 
<tr> 
    <td rowspan="3">col1</td> 
    <td rowspan="3">col2</td> 
    <td>col3.1</td> 
    <td rowspan="3">col4</td> 
</tr> 
<tr> 
    <td>col3.2</td> 
</tr> 
<tr> 
    <td>col3.3</td> 
</tr>  
</table>

do forse troppo poche informazioni, quindi se ne avete bisogno, mi dica :) Spero che la mia domanda sia chiara.

Grazie

fonte

2012-10-30 Jean-François Houzard

Il rowspan è davvero necessario? Non puoi semplicemente rendere 'fields3' in una tabella/lista annidata? – BalusC

Sì, potrebbe essere una tabella/lista annidata. Ho provato la variabile, ma non posso usarla nella cella: s –

Basta usare '' sulla proprietà 'fields3'. – BalusC

Una solida e tutto soluzione flessibile per griglie personalizzate è quello di utilizzare < c: forEach> insieme primefaces < p: panelGrid>:

<html ... xmlns:c="http://java.sun.com/jsp/jstl/core" 
      xmlns:p="http://primefaces.org/ui"> 
    <p:panelGrid> 
     <p:row> 
      <p:column styleClass="ui-state-default" colspan="2"><!-- header --> 
       <h:outputText value="Some Header"/> 
      </p:column> 
      ... 
     </p:row> 
     <p:row><!-- other header row --> 
      ... 
     </p:row> 
     <c:forEach items="#{list}" var="element"> 
      <p:row> 
       <p:column styleClass="ui-state-default" rowspan="#{list.sublist.someSizeExpression}"><!-- left rowspan --> 
        <h:outputText value="#{element.name}"/> 
       </p:column> 
       <c:forEach items="#{element.sublist}" var="subelement"> 
        <p:column> 
         <h:selectBooleanCheckbox/> 
        </p:column> 
       </c:forEach> 
      </p:row> 
     </c:forEach> 
    </p:panelGrid> 
</html>

sembra bello, Command-Buttons e AJAX lavora in sia Capo che Celle.

fonte

2012-12-25 15:25:08 Tires

Sembra buono :) Grazie –

dal momento che lei ha citato primefaces nelle vostre modifiche. Vi consiglio di utilizzare p:panelGrid

<p:panelGrid> 

    <p:row> 
     <p:column rowspan="3"/> 
     <p:column rowspan="3"/> 
     <p:column rowspan="1"/> 
     <p:column rowspan="3"/> 
    </p:row> 

    <p:row> 
     <p:column/> 
    </p:row> 

    <p:row> 
     <p:column/> 
    </p:row> 

</p:panelGrid>

fonte

2012-10-30 13:00:27

Sì, ma ho bisogno di ordinare alcune colonne, quindi DataTable sembra una buona scelta. –

Ho avuto lo stesso problema: primefaces (o RichFaces) offre rowspan solo per intestazione e piè di pagina.

Quindi ho provato a utilizzare il componente di ghiaccio ace:datatable ed è eseguito aggiungendo un solo attributo nelle colonne che si desidera siano "rowspanable": ace:column: groupBy="#{bean.field}".

Fornisci come al solito un elenco di righe e questo componente genera automaticamente tutto il rowspan (credo che riconosca automaticamente i valori uguali) nella tabella html generata.

Funziona insieme con i componenti primefaces: in questo momento ho primefaces outputlabel nelle celle datatable icefaces e questo icefaces datatable è all'interno di un pannello primefaces.

fonte

2012-11-22 16:25:38 jcgarnier

Ho finalmente implementato il mio tavolo personale: s –

@ Jean-FrançoisHouzard Per quelli come me, chi può avere questa funzione, può pubblicare la propria soluzione come anser per favore? – Stephan

RichFaces supporta rowspan! Lo usiamo in pochi posti con i sottotitoli. Assicurati di usare rendered = "# {rowKey eq 0}" rowspan = "# {bean.listSize}". Puoi persino avere ad es. la prima colonna con un rowspan di 10 e la seconda con gli spazi di 4 e 6 (solo ed esempio). Avrai bisogno di un altro indice per la seconda colonna per il tuo rendering. – Ben

Vorrei dare un'occhiata al DataTable di RichFaces. Ho trovato più flessibile della tabella PrimeFaces per layout complessi.

È possibile utilizzare

<rich:collapsibleSubTable 
    value="#{bean.getData()}" 
    var="line" 
    id="subTable" 
    rowKeyVar="rowKey" 
    width="100%"> 
<rich:column width="40" rendered="#{rowKey eq 0}" rowspan="#{line.firstColRowSpan}"> 
    #{line.country} 
    </rich:column> 
    <rich:column rendered="#{line.index eq 0}" rowspan="#{line.secondColRowSpan}"> 
     #{line.state} 
    </rich:column> 
    <rich:column> 
    #{line.city} 
    </rich:column> 
</rich:subtable>

quindi se i dati linea simile a questa:

US CA San Francisco 0 (index) 6 (firstColRowSpan) 3 (secondColRowSpan) 
US CA LA 1 6 3 
US CA Jose 2 6 3 
US TX Huston 0 6 2 
US TX Dallas 1 6 2 
US AZ Phoenix 0 6 1 
UK Surrey Guildford 0 1 1

La tabella avrebbe mostrato

US CA  San Francisco 
      LA 
      Jose 
    TX  Huston 
      Dallas 
    AZ  Phoenix 
UK Surrey Guildford

E 'importante che se si dispone di pulsanti/links etc in una delle colonne rowspan che aggiungete un rendering = "# {rowKey eq 0}" anche qui!

fonte

2015-06-04 15:41:46 Ben

Primefaces dataTable with rowspan

risposta

Problemi correlati