rich: эффект использования проблемы - PullRequest
7 голосов
/ 20 января 2011

Я хотел бы использовать rich:effect с элементом JSF в моем приложении, но у меня возникли небольшие проблемы с AJAX-аспектом.

Как показано ниже, у меня есть элемент h:outputTextкоторый имеет значение JSF (#{MyBacking.sysMsg}), которое изменяется в процессе взаимодействия с приложением.Поскольку элемент rich:effect использует события javascript, указание приведенного ниже кода не работает.

Я пытался использовать a4j: support для ajaxify элемента h:outputText, но, похоже, это тоже игнорируется.Пользователь не будет нажимать кнопки - переменная 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 Ответ

1 голос
/ 21 января 2011

Чтобы обновить текст, основываясь на изменениях на стороне сервера, вам придется использовать <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 и документация: rich: эффект a4j: опрос

...