Bezdepbonusu7Программирование: статьи и ответы
Меню

Вопрос

Как сохранить состояние DOM, управляемое jQuery/javasscript, при повторном рендеринге компонентов richfaces/jsf?

Автор вопроса: Ellie FabreroОтветов: 2

У меня проблемы с рендерингом некоторых компонентов в моем приложении jsf. Проблема в том, что когда я использую jQuery на своей странице, например, скрываю кнопку. Когда страница перерисовывается, кнопка возвращается к своей первоначальной форме, которая должна быть скрыта.

Есть ли у кого-то опыт в этом вопросе, который сможет помочь мне найти подходящее решение, или здесь есть какие-то принципы или методы, которые я слепо неправильно понял?

Спасибо. :)

jqueryjsf-2richfaces

Ответы

Ответ 1 · рейтинг 2 · BalusC

Проблема возникает, когда я использую jQuery на своей странице, например, скрываю кнопку. Когда страница повторно отображается, кнопка возвращается к своей первоначальной форме, которая должна быть скрыта.

Не используйте jQuery для управления DOM, а вместо этого используйте JSF Ajax для управления DOM.

E.g.

<h:form>
    <h:selectBooleanCheckbox value="#{bean.checked}">
        <f:ajax render="buttons" />
    </h:selectBooleanCheckbox>

    <h:panelGroup id="buttons">
        <h:commandButton value="Submit" rendered="#{bean.checked}" />
    </h:panelGroup>
</h:form>

Смотрите также

Ответ 2 · рейтинг 1 · Tim Brückner

Мы столкнулись с той же проблемой в IceFaces 1.8.2. Проблема в том, что приложение на стороне сервера не знает о ваших изменениях в DOM на стороне клиента. Мы решили эту проблему за нас, применив классы маркеров к элементам, которыми мы хотели манипулировать с помощью jQuery. Мы использовали общий обратный вызов на стороне клиента для обновлений DOM (onAsynchronousReceive в IceFaces 1.8.x), чтобы повторно применить наш скрипт.

К сожалению, не для RichFaces:

<h:outputText value="my text" styleClass="doSomethingWithThisAfterDOMUpdate" />

И где-то в разметке вашей страницы (мы используем jQuery, привязанный к j вместо $):

<script type="text/javascript">

    // do somehting the first time
    j(".doSomethingWithThisAfterDOMUpdate").css('display', 'none');

    Ice.onAsynchronousReceive("document:body", function() {

        // do it again after each asynchronous receive
        j(".doSomethingWithThisAfterDOMUpdate").css('display', 'none');
    });
</script>

НО: будьте осторожны, применяя прослушиватели к элементам в обратном вызове. Если элемент не заменяется, вы назначаете тех же слушателей второй, третий, четвертый раз...

В JSF2 AJAX стал частью спецификации. Вы можете взглянуть на метод на стороне клиента addOnEvent, который может быть общей частью Ice.onAsynchronousReceive.

Однако не все фреймворки компонентов, по-видимому, используют реализацию спецификации на стороне клиента для выполнения своих обновлений DOM (например, PrimeFaces).

Но я думаю, что принцип становится ясным. Вам нужно перезапустить скрипт после замены элемента DOM :)

Перевод вопроса и ответов сообщества Stack Overflow, лицензия CC BY-SA. Оригинал на Stack Overflow.

Похожие материалы