Recently I came across a requirement to show/hide text on page based on certain time interval. I achieved it by using af:poll component. Even though we can do it through setInterval function available in javascript, I faced some problem with clearInterval in different browsers.
af: poll: if you set timeout as -1 it will poll infinitely.
Java Script:
<af:resource type="javascript">
var _ivtxt;
function updateText(evt) {
evt.cancel();
var potll = evt.getSource();
_ivtxt = potll.findComponent("otiv4");
var vis = _ivtxt.getProperty("visible");
if (vis) {
_ivtxt.setVisible(false);
}
else {
_ivtxt.setVisible(true);
}
}
JSF:
<af:poll interval="#{pageFlowScope.showText? 1000 : -1}"
id="p5" timeout="-1">
<af:clientListener method="updateText" type="poll"/>
</af:poll>
<af:outputText value="Sample Text" id="otiv4" clientComponent="true"/>
af: poll: if you set timeout as -1 it will poll infinitely.
Java Script:
<af:resource type="javascript">
var _ivtxt;
function updateText(evt) {
evt.cancel();
var potll = evt.getSource();
_ivtxt = potll.findComponent("otiv4");
var vis = _ivtxt.getProperty("visible");
if (vis) {
_ivtxt.setVisible(false);
}
else {
_ivtxt.setVisible(true);
}
}
</af:resource>
JSF:
<af:poll interval="#{pageFlowScope.showText? 1000 : -1}"
id="p5" timeout="-1">
<af:clientListener method="updateText" type="poll"/>
</af:poll>
<af:outputText value="Sample Text" id="otiv4" clientComponent="true"/>