How to display two h:outputTexts in rich:extendedDataTable header column with different colors? - jsf

In the header column of <rich:extendedDataTable> I need to add two output texts in a single line as header label with different style class. How can I do this? I tried this different ways, but I can't achieve my goal.
<rich:extendedDataTable ...>
<rich:column label="Name">
<f:facet name="header">
<h:outputText value="Short Description" />
</f:facet>
<h:inputText ... />
</rich:column>
</rich:extendedDataTable>
I want display another label with a different color in the same line. I.e. "Short Description" is default style and next label in same line should be in different color.
For example, header column "Name" in black color and near this I want display * in red color like
-------------------------
Name * | Age
-------------------------
Here * should display in red color.

This is pretty straightforward. I think that your problem is caused by the fact that a <f:facet> cannot have more than one child. So the following wouldn't work:
<f:facet name="header">
<h:outputText value="Short Description" />
<h:outputText value="*" style="color:red;" />
</f:facet>
but the following should work:
<f:facet name="header">
<h:panelGroup>
<h:outputText value="Short Description" />
<h:outputText value="*" style="color:red;" />
</h:panelGroup>
</f:facet>

Related

Adding a scrollbar to a panelgrid in JSF

I have a panel grid having 50 columns atleast but during display all the columns in the UI gets congested. I tried the properties which i could but to no avail.
Below is my code. any help is appreciated.
<p:panel>
<h:outputLabel value="Search Results" style="font-weight: bold;"></h:outputLabel>
<p:dataTable scrollWidth="100%" id="SearchResult" var="SearchResult"
value="beanId" style="width:100%;"
selection="beanId"
rowKey="beanId" scrollable="true"
rowSelectMode="multiple" scrollHeight="100%">
<p:column selectionMode="multiple" style="width:5%;" />
<p:column>
<f:facet name="header">
<h:outputText value="Year" />
</f:facet>
<h:outputText value="MbeanValue" />
</p:column>
|
|
|
|
similarly upto 50 columns
</p:panel>
A p:panel generates a <div/> so the overflow-y CSS style attribute will work :
<p:panel style="float:left;overflow-y: auto;height: 100px;">
The height attrbute specifies the point at which the div should break into a scrollbar

How to generate a table with dynamic columns using rich:dataTable?

I have to generate a dynamic table using JSF. I have a arraylist containing headers and another list containing list of strings for holding the actual data - each entry in the main list representing a row. Is it possible to generate a dynamic table using rich:datatable? Is rich:columns an option to be considered?
This code works -
<rich:dataTable
value="#{dataBean.getAttributeDetail().getAttributeRows()}"
var="dataValues" width="100%" border="1">
<rich:columns
value="#{dataBean.getAttributeDetail().getAttributeHeaders()}"
var="columns" index="ind" id="column#{ind}">
<f:facet name="header">
<h:outputText value="#{columns}" />
</f:facet>
<h:outputText value="#{warningValues[ind]} " />
</rich:columns>
</rich:dataTable>
If you are using RichFaces 4, it still does not support "rich:columns", so instead use "c:forEach", like this:
<rich:dataTable value="#{teamHandler.mitarbeiter}" var="m">
<rich:column>
<f:facet name="header">Mitarbeiter</f:facet>
<h:outputText value="#{m.name}" />
</rich:column>
<c:forEach items="#{datumsHandler.span}" var="d">
<rich:column>
<f:facet name="header">
<h:outputText value="d" />
</f:facet>
<h:outputText value="-" />
</rich:column>
</c:forEach>
</rich:dataTable>
More information here.

JSF: Empty space caused by rendered attribute

How can I get rid of the empty space by components not rendered via rendered attribute?
I want to display a list of objects in a dataTable and sort them by a property they have. I do it likes this:
view plaincopy to clipboardprint?
<t:dataTable value="#{someBean.values}" var="value">
<h:column>
<f:facet name="header">
<t:outputText value="X" />
</f:facet>
<h:panelGroup rendered="#{value.property eq 'X'}">
<!-- some stuff -->
</h:panelGroup>
</h:column>
<h:column>
<f:facet name="header">
<t:outputText value="Y" />
</f:facet>
<h:panelGroup rendered="#{value.property eq 'Y'}">
<!-- some stuff -->
</h:panelGroup>
</h:column>
</t:dataTable>
It will display one item every row only, because of the rendered thingy. How can I avoid this? I stumpled upon this also on other occasions...
Thank you!
It is obvious to display one item every row with datatable.
You can better have two different datatables, one rendering for x and other rendering for y and adjust your css accordingly that looks like two column of the same table. Or else using richfaces, <rich:subTable> would help you, such as having two subTable in a single dataTable
Use a single column and render in there.
<t:dataTable value="#{someBean.values}" var="value">
<h:column>
<f:facet name="header">
<t:outputText value="#{value.property}" />
</f:facet>
<h:panelGroup rendered="#{value.property eq 'X'}">
<!-- some stuff -->
</h:panelGroup>
<h:panelGroup rendered="#{value.property eq 'Y'}">
<!-- some stuff -->
</h:panelGroup>
</h:column>
</t:dataTable>

Dynamic DataTable, Columns , Colomn 'Spans problem' [richfaces]

I'm a new developer in jsf1.2 & richfaces 3.3.3, i have a problem with my jsf page, when viewing a dynamic dataTable, i can't build the head with a group column, knowing that i use columns in ColumnGroup, column Span and Row have no effect even if i give values or not!
the code for the head part of the table:
<rich:dataTable cellpadding="0" cellspacing="0" width="700" border="0">
<f:facet name="header">
<rich:columnGroup>
<rich:columns var="column" value="#{xmlBean.tableModele.head.column}">
<rich:column breakBefore="#column.breakBefore}" rowspan="#{column.rowSpan}" colspan="#{column.colSpan}">
<h:outputText value="#{column.libelle}" rendered="#{column.champ.type=='text'}" />
</rich:column>
</rich:columns>
</rich:columnGroup>
</f:facet>
</rich:dataTable>
I solved the problem :), it was necessary that i remove the "column" without 's', because the "columns" generate "column")
the code :
<f:facet name="header">
<rich:columnGroup>
<rich:columns var="column" value="#{xmlBean.tableModele.head.column}" rowspan="#{column.rowSpan}" colspan="#{column.colSpan}" breakBefore="#{column.breakBefore}">
<h:outputText value="#{column.champ.valeur}" rendered="#{column.champ.type=='text'}" />
</rich:columns>
</rich:columnGroup>
</f:facet>
thanks, its my fist post, i'm glad to be here ;)

JSF two-colum repeatable table inside panelgrid or equivalent

I have List of items that needs to be displayed as a table. That table need to be repeated as a two-column grid where each cell contains the same table side by side where the right side is a continuation of the right side table, like so:
a|b|c a|b|c
-+-+- -+-+-
1|2|3 5|6|7
x|y|z n|m|o
..... .....
How can I achieve this?
Maybe you could make your managed bean return list of lists and use <ui:repeat> and <h:dataTable>. Each of your internal list is for one table, and contains table rows.
<ui:repeat value="#{bean.tablesLists}" var="tableList">
<h:dataTable var="tableRow" value="#{tableList}">
<h:column>
<f:facet name="header">
<h:outputText value="a" />
</f:facet>
<h:outputText value="#{tableRow.data1}" />
</h:column>
<h:column>
<f:facet name="header">
<h:outputText value="b" />
</f:facet>
<h:outputText value="#{tableRow.data2}" />
</h:column>
</h:dataTable>
</ui:repeat>

Resources