Как повторно выполнить функцию javascript после перезапуска формы?

Мне нужно повторно выполнить javascript сразу после того, как форма будет повторно отображена. Просто, ввод javascript после содержимого XHTML не поможет, так как его частичный запрос. Кроме того, я не могу использовать "onComplete" в качестве командной кнопки, из которой я перерисовываю форму, в компоненте JSF, используемом в нескольких местах. Мне нужно получить исправление локально.

есть ли способ? Мне было интересно, поможет ли F: ajax в этом случае.

пожалуйста, дайте мне знать, если кто имеет представление об этом.

16
javascript jsf rerender

3 ответов

самый простой способ-просто поместить вызов функции JS в сам обновляемый компонент.

<h:form>
    ...
    <h:commandButton value="submit"><f:ajax render="@form" /></h:commandButton>
    <h:outputScript>someFunction();</h:outputScript>
</h:form>

таким образом, он выполняется по мере загрузки страницы, а также если форма обновляется ajax.

как к <f:ajax> сам, вы также можете использовать его .

<f:ajax ... onevent="handleAjax" />

С

function handleAjax(data) {
    var status = data.status;

    switch(status) {
        case "begin":
            // This is invoked right before ajax request is sent.
            break;

        case "complete":
            // This is invoked right after ajax response is returned.
            break;

        case "success":
            // This is invoked right after successful processing of ajax response and update of HTML DOM.
            someFunction();
            break;
    }
}

вы можете добавить глобальный крюк по jsf.ajax.addOnEvent() так что вам не нужно указывать его в каждом на <f:ajax> если функциональное требование применяется к каждому запросу ajax.

jsf.ajax.addOnEvent(handleAjax);

альтернативой является использование библиотека утилит OmniFaces JSF, который предлагает <h:onloadScript> именно для этой цели. Вы можете поместить его в голове, так что вы хотите.

<h:onloadScript>someFunction();</h:onloadScript>

это автоматически отменяется при каждом запросе ajax в представлении, так что вам не нужно копировать его по нескольким отдельным местам в представлении, которые могут быть обновлены ajax, или повторять его Родительский идентификатор в каждом <f:ajax render>.

37

BalusC первый ответ является наиболее подходящим, если вы хотите сделать сложные операции С JQuery/JS и не особенно обеспокоены этой

для более сложных JS, если вы решили использовать глобальный обработчик событий и, например, используете JS для bind функции для элементов, эти функции будут повторно связаны (следовательно, выполняются дважды), поэтому вам нужно каким-то образом определить, что нужно повторно выполнить.

то, что я наконец сделал, было чтобы получить идентификатор из обратного вызова события и выполнить только соответствующий JS / JQuery:

jsf.ajax.addOnEvent(ajaxCompleteProcess);


function ajaxCompleteProcess(data) {
    if (data.status && data.status === 'success') {
        var children1 = data.responseXML.children;
        for (i = 0; i < children1.length; i += 1) {
            var children2 = children1[i].children;
            for (j = 0; j < children2.length; j += 1) {
                var children3 = children2[j].children;
                for (y = 0; y < children3.length; y += 1) {
                    if (children3[y].id.indexOf('javax.faces.ViewState') != -1)
                        continue;
                    elementProcess(('#' + children3[y].id.replace(/\:/g, '\:')));
                }
            }
        }
    }
}

примечание: эти уродливые for петли, вероятно, не требуются (вы можете использовать clildren[0]), но я еще не нашел времени, чтобы проверить спецификацию.

0

Вы можете добавить jQuery в свое приложение и сделать что-то вроде:

$(#yourComponentId).load(function(){
   //execute javascript.
});

вы можете посмотреть здесь http://api.jquery.com/load/

LE: это быть на

$(document).ready(function(){
}

ОФК.

-1