Updating p:graphicImage every n seconds

Question

I was wondering if someone could either explain or point me to a good resource that will help me understand how to update a p:graphicImage in Primefaces 5.0. What I'm trying to do is pretty simple.

<p:graphicImage value="myImage.png"/>

The filename never changes, but it will be updated every n seconds. I'm trying to figure out the easiest way to update that image every n seconds. In this case we'll say every 5.

tyia

Update: I've tried the suggestions below but poll isn't updating. I've tested this in IE, FF, and Chrome. I'm using the sample code on the prime faces. Here's my bean:

@ManagedBean
@ViewScoped
public class CounterView implements Serializable {

    private int number;

    public int getNumber() {
        return number;
    }

    public void increment() {
        System.out.println("test");
        number++;
    }
}

I'm outputting to the console to see if increment() is ever executed, which it isn't.

Here's my xhtml:

<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:p="http://primefaces.org/ui">
    <h:head>
        <title></title>
    </h:head>
    <h:body>
        <h:form>       
            <p>Welcome, #{loginBean.uname}</p>
        <p:commandButton action="#{loginBean.logout}" value="Logout"  ajax="false"></p:commandButton>
        <br/>
        <h:form>
          <h:outputText id="txt_count" value="#{counterView.number}" />
          <p:poll interval="3" listener="#{counterView.increment}" update="txt_count" />
        </h:form>
    </h:form>
    </h:body>
</html>

The above is the page that I'm redirecting to after a successful login. All output is correct except for txt_count....it stays at 0. I took the image out to get this working before applying it to the image update.

Update 2: Got the int counter working

<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:p="http://primefaces.org/ui">
    <h:head>
        <title></title>
    </h:head>
    <h:body>
        <h:form>       
            <p>Welcome, #{loginBean.uname}</p>
        <p:commandButton action="#{loginBean.logout}" value="Logout"  ajax="false"></p:commandButton>
        <br/>
                  <h:outputText id="txt_count" value="#{counterView.number}" />
          <p:poll interval="3" listener="#{counterView.increment}" update="txt_count" />
    </h:form>
    </h:body>
</html>

Unknown Unknown · Accepted Answer · 2014-07-06T10:58:30

You might use a poll component with a listener method that changes the image.

<p:poll interval="3" listener="#{your_method_to_change_the_image()}" update="myImage" />
<p:graphicImage id="myImage" value="myImage.png"/>

Disclaimer : Not tested.

Updating p:graphicImage every n seconds

2 Answers