Search code examples
jsfprimefacesjsf-2.2graphicimage

How to display alternate text on <p:graphicImage> in PrimeFaces?


I'm displaying images on <p:graphicImage> which are stored under the webroot\resources\fileUpload\product_image\thumb directory as follows.

<p:graphicImage library="fileUpload" 
                name="#{not empty row.prodImage?'product_image/thumb/':'&nbsp;'}#{row.prodImage}" 
                alt="#{row.prodName}"/>

row refers to a JPA entity object stored in a java.util.List<Entity> which is retrieved while iterating over a <p:dataTable>.


When an image name is empty, the name attribute of <p:graphicImage> is evaluated to name=" ". In which case, it does not work just leaving the page blank without any errors.

If &nbsp; in the conditional expression is removed then, it causes java.lang.StringIndexOutOfBoundsException to be thrown.

So, how to display alternate text on <p:graphicImage>, if the image to display is unavailable?


Solution

  • If &nbsp; in the conditional expression is removed then, it caused java.lang.StringIndexOutOfBoundsException to be thrown

    Indeed, reproduced it. That's technically a bug in PrimeFaces' GraphicImageRenderer. At line 70, it should have done a if(name != null && !name.isEmpty()) instead of alone name != null before trying to get it as a resource.

    I'm not sure if it's for them worth to fix it as it actually doesn't make sense to specify an empty name and the workaround is relatively easy by conditionally rendering two images, one without the name and another with the name:

    <p:graphicImage alt="#{row.prodName}" rendered="#{empty row.prodImage}" />
    <p:graphicImage library="fileUpload" name="product_image/thumb/#{row.prodImage}" alt="#{row.prodName}" rendered="#{not empty row.prodImage}" />