rico: problema de uso del efecto

Question

Me gustaría usar un rich:effect con un elemento JSF en mi aplicación, pero estoy teniendo un pequeño problema con el lado AJAX de las cosas.

Como se muestra a continuación, tengo un elemento h:outputText que tiene un valor de referencia JSF (#{MyBacking.sysMsg}) que cambia durante la experiencia del usuario con la aplicación. Como el elemento rich:effect usa eventos javascript, no es posible especificar el siguiente código.

He intentado usar a4j: support para ajaxify el elemento h:outputText pero esto aparentemente también se ignora. El usuario no hará clic en ningún botón: la variable sysMsg se actualiza en otro lugar y quiero resaltar un cambio en la audiencia.

El código es el siguiente:

<h:outputText value="#{MyBacking.sysMsg}" id="sysMsg" style="#{MyBacking.colour}" /> 
<rich:effect event="onchange" type="Highlight" params="duration:0.8" /> 
<rich:effect event="onchange" for="sysMsg" type="Appear" params="delay:3.0,duration:0.5" /> 

creo que hay muchas posibilidades de encontrar una respuesta sencilla para esto, pero me parece que no puede encontrar la respuesta en la cabeza o en la red. ¿Alguien puede ayudarme?

Answer 1

Para actualizar el texto en función de los cambios del lado del servidor, deberá usar <a4j:poll> o <a4j:push>.

ej .:

<rich:effect name="highlight" for="sysMsg" type="Highlight" params="duration:0.8" /> 

<h:form> 
<a4j:poll id="poll" interval="1000" reRender="sysMsg" oncomplete="highlight();"/> 
</h:form> 

Esto por supuesto destacará cada segundo y no sólo cuando ha cambiado el valor. Para resaltar solo el cambio, probablemente sea mejor usar una función javascript/jquery personalizada, recuerde el valor y llame a resaltar cuando cambie.

Aquí es una solución posible:

<h:form id="form"> 
<a4j:region renderRegionOnly="true"> 
    <h:outputText value="#{MyBacking.sysMsg}" id="sysMsg" style="#{MyBacking.colour}" /> 
    <a4j:poll id="poll" interval="1000" reRender="sysMsg" oncomplete="checkChange();" limitToList="true"/> 
</a4j:region> 

<rich:effect name="highlight" for="sysMsg" type="Highlight" params="duration:0.8" /> 

</h:form> 

<script> 
var value = $('form:sysMsg').textContent ; 
function checkChange(){ 
    if($('form:sysMsg').textContent != value){ 
     highlight(); 
    } 
} 
</script> 

Estas son muestras: Exadel Demo y la documentación: rich:effecta4j:poll