Выполнить скрипт на событии F: ajax "success" только тогда, когда проверка не завершилась неудачей

Question

Выполнить скрипт на событии F: ajax "success" только тогда, когда проверка не завершилась неудачей

Я создал составной компонент, который расширяет командную кнопку и добавляет некоторые функции ajax (onBegin, onComplete и onSuccess), но у меня есть некоторые проблемы, которые я не смог решить:

Когда я нажимаю на кнопку и возникает ошибка проверки, в случае успеха передается функция #{facesContext.validationFailed} = false вместо true даже думал, что форма снова рендерится; (html рендерится перед вызовом события успеха, верно?)

<html xmlns="http://www.w3.org/1999/xhtml"

      xmlns:cc="http://java.sun.com/jsf/composite"

      xmlns:h="http://java.sun.com/jsf/html"

      xmlns:f="http://java.sun.com/jsf/core">



<cc:interface shortDescription="CommandButton com Ajax">



    <cc:attribute name="onbegin"/>

    <cc:attribute name="oncomplete"/>

    <cc:attribute name="onsuccess"/>

    <cc:attribute name="render"/>

    <cc:attribute name="execute"/>

    <cc:attribute name="action" targets="commandButton"/>

    <cc:attribute name="actionListener" targets="commandButton"/>

    <cc:attribute name="value"/>

    <cc:attribute name="styleClass" targets="commandButton"/>

    <cc:attribute name="immediate" targets="commandButton"/>



</cc:interface>



<cc:implementation>



    <h:outputScript library="progutils" name="/js/commandButton.js" target="HEAD"/>



    <h:commandButton id="commandButton" value="#{cc.attrs.value}">

        <f:ajax render="#{cc.attrs.render}" execute="#{cc.attrs.execute}"

                onevent="function(data){execCommandButtonAjax(data, function(){ #{cc.attrs.onbegin} },function(){ #{cc.attrs.oncomplete} },function(){ #{cc.attrs.onsuccess} }, #{facesContext.validationFailed})}">

        </f:ajax>

    </h:commandButton>



</cc:implementation>



</html>

Javascript Файл

function execCommandButtonAjax(data, onBegin, onComplete, onSuccess, validationFailed) {

    var status = data.status;

    switch (status) {

        case 'begin': {

            onBegin();

            break;

        }

        case 'complete': {

            onComplete();

            break;

        }

        case 'success': {

            console.log('Validation Failed ' + validationFailed);

            if(!validationFailed){

                onSuccess();

            }

            break;

        }

    }

}

Использование компонента:

<pu2:commandButton id="btnPu2" 

                   onbegin="block(); console.log('begin')"                                                                    

                   oncomplete="unblock(); console.log('complete')"

                   onsuccess="console.log('success')"

                   execute="@form"

                   action="#{list.search()}"

                   render="@form :table-form :form-pagination"

                   value="Do it">

</pu2:commandButton>

621 1

javascript ajax event-handling jsf-2

1 ответ:

Comments

Ничего не найдено.

BalusC · Accepted Answer · 2015-06-12 10:18:50

Выражения EL вычисляются при создании вывода HTML. Они не оцениваются во время событий JavaScript или около того. Щелкните правой кнопкой мыши и просмотрите Источник . Видите ли, это один и тот же HTML/JS. Никаких компонентов JSF, никаких выражений EL. JSF - это" просто " генератор HTML-кода.
Поэтому, когда вы загружаете страницу, #{facesContext.validationFailed} напечатает false. именно это значение передается в качестве аргумента функции JS. Он будет работать только в том случае, если вы повторно визуализируете компонент JSF, ответственный за печать #{facesContext.validationFailed} до этого передача его в качестве аргумента функции JS.
Стандартный JSF не предоставляет никаких возможностей для передачи дополнительной информации в ответ ajax. Библиотеки компонентов, такие как PrimeFaces и OmniFaces, поддерживают это с помощью пользовательского PartialViewContext. PrimeFaces имеет даже встроенное свойство validationFailed в своем объекте args, которое доступно в любом атрибуте oncomplete.

Лучше всего сделать условный рендер onsuccess самого скрипта.
<h:commandButton id="commandButton" value="#{cc.attrs.value}">
    <f:ajax execute="#{cc.attrs.execute}" render="#{cc.attrs.render} onsuccess" 
            onevent="function(data){execCommandButtonAjax(data, function(){ #{cc.attrs.onbegin} },function(){ #{cc.attrs.oncomplete} })}">
    </f:ajax>
</h:commandButton>
<h:panelGroup id="onsuccess">
    <h:outputScript rendered="#{facesContext.postback and not facesContext.validationFailed}">
        #{cc.attrs.onsucces}
    </h:outputScript>
</h:panelGroup>