Show boolean values as icons - jsf

Question

I have DataTable with 5 columns. In one column are boolean values – true or false. I would like to show icons instead “true” or “false” literals. How can I show Boolean values as icons?

Answer 1

this is quiet simple.You just use the rendered attribute. Try this code:
<h:column>
<f:facet name="header">Col Name</f:facet>
<h:graphicImage value="../image1.jpg" rendered="#{yourBoolean}" />
<h:graphicImage value="../image2.jpg" rendered="#{!yourBoolean}" />
</h:column>

Answer 2

This can be achieved by using rendered's attribute of the graphic image's tag :
<h:dataTable value="#{managedBean.yourList}" var="list" rules="all" >
<h:column>
...
</h:column>
<h:column>
<f:facet name="header">Your column name</f:facet>
<h:graphicImage rendered="#{list.yourBoolean eq true}" library="images/SomeFolder" name="someTrueImage.png" />
<h:graphicImage rendered="#{list.yourBoolean eq false}" library="images/SomeFolder" name="someFalseImage.png" />
</h:column>
<h:column>
...
</h:column>
</h:dataTable>

Answer 3

You can use rendered attribute (as you can see in other answers), or incorporate condition inside value tag using ternary operator:
<h:graphicImage value="#{yourBoolean ? image1.png : image2.png}" />

Answer 4

The best (IMO) would be :
<h:dataTable value="#{myBean.myList}" var="myVarName">
.
..
...
<h:panelGroup styleClass="#{myVarName.myBoolean?'myTrueClass':'myFalseClass'}"/>
where in css
.myTrueClass {
width: 16px;
height: 16px;
background-image:url('../resources/images/myTrue.png');
}
.myFalseClass {
width: 16px;
height: 16px;
background-image:url('../resources/images/myFalse.png');
}
By using the css you will make you life much easier... easier to maintain