Hide data table automatically if there is no data to show - jsf

I have this simple data table:
<h:dataTable id="table1" value="#{fournisseurbean.BC.listematpilotaccess1}" style="width : 900px; " var="item"
border="1">
<h:column>
<f:facet name="header">
<h:outputText value="idmatpilotaccess1n" />
</f:facet>
<h:outputText value="#{item.idmatpilotaccess1}" />
</h:column>
<h:column>
<f:facet name="header">
<h:outputText value="serie" />
</f:facet>
<h:outputText value="#{item.serie}" />
</h:column>
</h:dataTable>
I would like to not show this table if there is no data to show, so when
#{fournisseurbean.BC.listematpilotaccess1} is empty. How can I achieve this?

Add a rendered attribute to the tag
<h:dataTable rendered="#{not empty fournisseurbean.BC.listematpilotaccess1}">
This will render the component if the expression evaluates to true.

render its ok but if you want to hide more than the datatble ,for example : a label or a div.
you can use :
<c:if test="#{beanMb.beanList.size() gt 0 }">
....code
</c:if>

Related

Render column depending on row rendering

I have a dataTable like this one:
<h:dataTable value="#{myList}" var="myVariable" >
<h:column>
<f:facet name="header"/>
<h:graphicImage style="display:block; margin:0px auto" value="imageURL" rendered="#{condition}"/>
</h:column>
<h:column>
<f:facet name="header">
Attribute1
</f:facet>
<h:outputText style="display:block; text-align:center" value="#{myVariable.attribute1}" />
</h:column>
<h:column>
<f:facet name="header">
Attribute2
</f:facet>
<h:outputText style="display:block; text-align:center" value="#{myVariable.attribute2}" />
</h:column>
<h:column>
<f:facet name="header">
Attribute3
</f:facet>
<h:outputText style="display:block; text-align:center" value="#{myVariable.attribute3}" />
</h:column>
</h:dataTable>
As you can see, I have multiple columns displaying all the attributes of a variable, and an image which is shown in a column if a condition is satisfied.
However, not fulfilling that condition give us a table with an empty column which I would like to not being shown.
Is there any way to hide that column when no image is shown in all the rows?

Conditional column rendering

I'm working with jsf 2.0. I have this datatable
<h:dataTable value="#{agreement.licenseProducts}"
var="licenseProduct"
styleClass="pnx-table pnx-table-bdr pnx-table-unstyled mp-license-info">
<h:column>
<f:facet name="header">
<h:outputText value="Product" />
</f:facet>
<h:outputText value="#{licenseProduct.description}" />
</h:column>
<h:column>
<f:facet name="header">
<h:outputText value="Serial Number" />
</f:facet>
<h:outputText value="#{licenseProduct.serialNumber}" />
</h:column>
<h:column>
<f:facet name="header">
<h:outputText value="#{agreement.labelForConcurrency}" />
</f:facet>
<h:outputText value="#{licenseProduct.concurrent}" />
</h:column>
<ui:fragment rendered="#{agreement.managementTool != 'NONE'}">
<h:column>
<f:facet name="header">
<h:outputText value="#{agreement.labelForLicenseType}" />
<span class="pnx-icon-right pnx-icon-info pnx-tooltip">
<div class="pnx-tooltip-content">
<h:outputText value="Tooltip content" />
</div>
</span>
</f:facet>
<h:outputText value="#{licenseProduct.licenseBase}" />
</h:column>
</ui:fragment>
<h:column>
<f:facet name="header">
<h:outputText value="#{agreement.labelForSeatCount}" />
</f:facet>
<h:outputText value="#{licenseProduct.seats}" />
</h:column>
</h:dataTable>
The problem is that the ui:fragment part is not working. No matter what the attribute's value is, it will NEVER show the column.
Any ideas?
--EDIT--
Just in case, I have other ui:fragments that depend on that same attribute, and they do render correctly depending on the attribute's value. I'm sure it has to do with the dataTable and the columns.
The rendered's attribute of <h:column> tag performs simply the job :
<h:column rendered="#{agreement.managementTool != 'NONE'}">
...
</h:column>

Why does <h:column><f:facet name="header"><h:outputText> render as th instead of td

I have below code:
<h:dataTable class="pretty" value="#{ftManagedBean.ftDataModel}" >
<h:column>
<f:facet name="header">
<h:outputText value="Name"/>
</f:facet>
</h:column>
<h:column>
<f:facet name="header">
<h:outputText value="Outstanding"/>
</f:facet>
</h:column>
</h:dataTable>
But it prints Name and Outstanding between <th></th> tags. Why? I need them in <td></td> tags. How can I do that?
Name and Outstanding end up in <th> elements because you placed them inside <f:facet name="header"> tags. Remove those and they'll be output to <td> tags.
<h:dataTable class="pretty" value="#{ftManagedBean.ftDataModel}" >
<h:column>
<h:outputText value="Name"/>
</h:column>
<h:column>
<h:outputText value="Outstanding"/>
</h:column>
</h:dataTable>
See the JSF HTML Tag Reference for an example on creating a table.
You have to change your code into this:
<h:dataTable class="pretty" value="#{ftManagedBean.ftDataModel}" >
<h:column>
<h:outputText value="Name"/>
</h:column>
<h:column>
<h:outputText value="Outstanding"/>
</h:column>
</h:dataTable>
If you wrap your output text within the <f:facet name="header"> this corresponds to <th> (table header), otherwise they will be printed in <td>.
I try this solution and ok.
(http://www.coderanch.com/t/431222/JSF/java/dynamically-set-panel-header-condition)
<rich:dataGrid value="#{myMB.student.list}" rendered="#{!empty myMB.student and !empty myMB.student.list}" var="st" rowKeyVar="row">
<rich:panel>
<f:facet name="header">
<h:panelGroup id="panelHeader">
<h:outputText value="Just one student" id="header1" required="true" rendered="#{!myMB.manyStudents}"/>
<h:outputText value="#{row+1}ยบ Student" id="header2" required="true" rendered="#{myMB.manyStudents}"/>
</h:panelGroup>
</f:facet>
<rich:panel>

Richfaces: component rich:dataScroller doesn't work

i'm using richfaces 3.3.3 I've a rich:dataTable inside another rich:dataTable and both have a rich:dataScroller but the inner doesn't work:
<rich:dataTable id="dataTableVisibility" value="#{jsfGridUtenti.itemKeys}"
var="roleName" cellspacing="1"
cellpadding="1" border="1"
styleClass="tab" style="width:60%"
rowClasses="rdispari,rpari"
headerClass="headTab" rows="3"
rendered="#{jsfGridUtenti.renderPanelReportVisibility}">
<f:facet name="footer">
<rich:datascroller for="dataTableVisibility"
fastStep="10" pagesVar="pageCountCl"
pageIndexVar="pageIndexCl"
maxPages="9" renderIfSinglePage="false"
selectedStyle="font-weight:bold;">
</rich:datascroller>
</f:facet>
<h:column>
<f:facet name="header">
#{applicationMessages.ruolo}
</f:facet>
<a4j:commandLink reRender="reportUserVisibilityCompanyRoleClass" action="#{jsfGridUtenti.deleteAssociationRole(roleName)}">
<h:graphicImage styleClass="toolbarLabel" url="../resources/img/cancella.png" />
</a4j:commandLink>
<rich:spacer height="1" width="8" />
<h:outputText style="font-size:11px" value="#{roleName}"/>
</h:column>
<h:column>
<f:facet name="header">
#{applicationMessages.companyAssociate}
</f:facet>
<h:column>
<rich:dataTable id="dataTableCompany"
var="company" value="#{jsfGridUtenti.findCompanyInHashMap(roleName)}"
style="width:100%" rows="5"
rowClasses="rdispari,rpari"
columnsWidth="10%,10%,80%"
headerClass="headTab">
<f:facet name="footer">
<rich:datascroller for="dataTableCompany"
fastStep="10" pagesVar="pageCountCls"
pageIndexVar="pageIndexCls"
maxPages="9" ajaxSingle="true"
selectedStyle="font-weight:bold;"
renderIfSinglePage="false">
</rich:datascroller>
</f:facet>
<h:column>
<a4j:commandLink reRender="reportUserVisibilityCompanyRoleClass" action="#{jsfGridUtenti.deleteAssociationCompany(roleName,company)}">
<h:graphicImage styleClass="toolbarLabel" url="../resources/img/cancella.png" />
</a4j:commandLink>
</h:column>
<h:column>
<a4j:commandLink immediate="true" action="#{jsfGridUtenti.setCompanyToShow(roleName,company)}"
reRender="showClassi,panelGridReport">
<h:graphicImage styleClass="toolbarLabel" url="../resources/img/lente.png" />
</a4j:commandLink>
</h:column>
<h:column>
<h:outputText style="font-size:11px" value="#{company.label}"/>
</h:column>
</rich:dataTable>
</h:column>
</h:column>
</rich:dataTable>
Now when I click on the outer rich:dataScroller it works well, instead when I click on the inner nothing happens. How can I fix?
This is a known issue. rich:datascroller doesn't support nested iteration components such as dataTable, repeat etc.
There is a JIRA issue for this.
Did you say 'nothing happens'? Did you look at your console? Doesn't it display a warning like this?
The requested page #2 isn't found in the model containing 1 pages. Paging is reset to page #1
I got the same warning message and solved it by adding a session variable like:
<rich:dataScroller for="table" page="#{sessionBean.page}" />
In my case the bean wasn't accessible (due to scope) before I changed the code. I was on the wrong track because I would have expected a warning/error pointing out that the problem is related to the expression language.

Why <h:dataTable> make all rows as same as "selected row" value?

I've ArrayList Collection carry the values properly , but the problem when i rendered it in h:dataTable tag the rows become all same value like in the picture.
<h:dataTable value="#{contactController.contacts }" var="contact"
rowClasses="oddRow, evenRow" styleClass="contactTable"
headerClass="headerTable" columnClasses="normal,centered"
rendered="#{not empty contactController.contacts }">
<h:column>
<f:facet name="header">
<h:column>
<h:outputText value="Name" />
</h:column>
</f:facet>
<h:outputText
value="#{contactController.contact.firstName }#{ contactController.contact.secondName }" />
</h:column>
<h:column>
<f:facet name="header">
<h:column>
<h:outputText value="Action" />
</h:column>
</f:facet>
<h:panelGrid columns="2">
<h:commandLink value="remove"
action="#{contactController.remove }">
<f:setPropertyActionListener value="#{contact }"
target="#{contactController.selectedContact }" />
</h:commandLink>
<h:commandLink value="edit" action="#{contactController.read}">
<f:setPropertyActionListener value="#{contact }"
target="#{contactController.selectedContact }" />
</h:commandLink>
</h:panelGrid>
</h:column>
</h:dataTable>
Any suggestion? .
I think there are two problems with your code.
First you don't need the bean's name in your columns. Simply use the content of the var attribute (in your case "contact" and not "contactController.contact")
Second: The h:column inside f:facet is not correct. Put the h:outputText directly into f:facet.
Change your first column this way:
<h:column>
<f:facet name="header">
<h:outputText value="Name" />
</f:facet>
<h:outputText value="#{contact.firstName} #{contact.secondName }" />
</h:column>

Resources