2011-01-20 10 views
7

私のアプリケーションではrich:effectをJSF要素で使用したいのですが、AJAX側で少し問題があります。リッチ:エフェクト使用上の問題

下記のとおり、私はh:outputText要素を持っています。この要素は、アプリケーションのユーザーエクスペリエンス中に変更されるJSF参照値(#{MyBacking.sysMsg})を持っています。 rich:effect要素でjavascriptイベントが使用されているため、以下のコードを指定しても機能しません。

h:outputText要素をajaxifyするためにa4j:supportを使用しようとしましたが、これも無視されています。ユーザがクリックしないボタン - sysMsg変数は他の場所で更新され、視聴者への変更を強調したい。

<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" /> 

が、私はこのための簡単な答えがあるようにバインドだと思うが、私は私の頭の中やネット上で答えを見つけるように見えることはできません。次のように

コードがあります。誰でも助けてくれますか?

答えて

1

サーバサイドの変更に基づいてテキストを更新するには、<a4j:poll>または<a4j:push>を使用する必要があります。

例えば:もちろん

<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> 

これは、値が変更された場合にのみ、毎秒及びませんが強調表示されます。変更時にのみ強調表示するには、カスタムjavascript/jquery関数を使用する方がよいでしょう。ここで

<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> 

されているサンプル:Exadel Demoとドキュメント:ここ

が可能なソリューションであるあなたの助けをrich:effecta4j:poll

+0

おかげで - 私は無駄にajaxedパネルとdiv要素の両方を試してみました。 – volvox

+0

サーバサイドの価値の変化に合わせて自分の答えを更新しました。 – morja

関連する問題