Hi!
One thing in JSF which constantly worries me is, that it is not easily
possible to create a more complicated table layout with
group/group/detail style.
What I mean is somthing like this:
Name Column1 Column2
Data1HeaderInformation1
Sub1HeaderInformation1
Name1 10 20
Sub1HeaderInformation2
Name2 20 30
Data2HeaderInformation1
Sub2HeaderInformation1
Name3 40 50
Name5 60 70
This reflects a list in a list in a list.
Currently, with JSF there is no chance to nest tables in such a way
without rendering completely unrelated tables. The problem is, that the
sub tables then have their own column width and it is hard to make them
look as just one table.
I thought about a new attribute on the dataTable (embedded="true") which
avoids rendering the <table></table> attributes so that the rendered
table nicely nest into the parent table.
For sure, the user has to take care that the numer of columns are the
same among all tables, probably by using stuff like "t:column colspan=".
Secondly, to make this fully usable, we need another way to define the
header of a table as the "master" table has to render a very special
header where one would like to mix in the header of the detail row.
For this, I thought we could use a facet directly on the datatable. In
the end, it might look like the following:
<t:datable var="group1" value="#{bean.data}">
<f:facet name="columnHeader1">
<t:column colspan="2">
<t:outputText value="header" />
</t:column>
</f:facet>
<f:facet name="columnHeader2">
<t:column>
<t:outputText value="detailA" />
</t:column>
</f:facet>
<f:facet name="columnHeader3">
<t:column>
<t:outputText value="detailB" />
</t:column>
</f:facet>
...
<t:column colspan="10">
<t:outputText value="#{group1.headerValue}" />
</t:column>
</t:datable var="group2" value="#{group1.groupData}" embedded="true">
<t:column colspan="2">
<t:outputText value="#{group2.headerValue2}" />
</t:column>
<t:column colspan="8">
<t:outputText value="#{group2.headerValue2}" />
</t:column>
</t:datable var="detail" value="#{group2.detailData}"
embedded="true">
<t:column>
<t:outputText value="#{detail.value1}" />
</t:column>
....
<t:column>
<t:outputText value="#{detail.value10}" />
</t:column>
</t:datable>
</t:datable>
</t:datable>
I know, with facelets I can achive the same using plain html tags and
dataLists, but I STRONGLY prefer NOT to use such an approach, I'd like
to use ONLY components.
What do you think?
Ciao,
Mario