Повторная инициализация JQuery с обновлениями DOM XPages для частичного обновления

У меня есть панель с вкладками из основных элементов управления и внутри нее есть <xp:inputText> который имеет хук для некоторого jQuery, используемого для ограничения длины поля. Это прекрасно работает, если у меня есть эта вкладка на экране, когда я переключаю страницу в режим редактирования. Однако, если я не на этой вкладке и не переключаюсь в режим редактирования, а ТО перехожу на нужную вкладку, она не работает.

Я предполагаю, что это потому, что эти элементы управления не существовали, когда JQuery запустился. Кто-нибудь знает способ, чтобы jQuery обновлял себя, чтобы подобрать новые дополнения DOM, которых не было при начальной загрузке?

Это код, который существует выше на странице:

<xp:scriptBlock id="scriptBlock1">
        <xp:this.value><![CDATA[$('input[maxlength]').maxlength({
            alwaysShow: true,
            threshold: 10,
            warningClass: "label label-success",
            limitReachedClass: "label label-danger"
        });]]></xp:this.value>
    </xp:scriptBlock>

Поле это:

<xp:inputText id="inputText2"
                        value="#{viewScope.vsWorkingContentAdd.description}">
                        <xp:this.attrs>
                            <xp:attr name="maxlength" loaded="true" value="75"></xp:attr>
                        </xp:this.attrs>
                    </xp:inputText>

Опять же, код работает, так как он находит поля, которые уже существуют. Этот вопрос возникает в XPages, когда вы делаете частичное обновление и <xp:inputText> появляется, как вы получаете jQuery, чтобы увидеть это?

1 ответ

Решение

Вы правы, что объекты, которые имеют атрибуты и события, назначенные с помощью javascript, нуждаются в их переназначении после их перезагрузки во время частичного обновления. Вы можете изменить блок скрипта так, чтобы он выглядел примерно так:

function setValidation() {
    $('input[maxlength]').maxlength({
        alwaysShow: true,
        threshold: 10,
        warningClass: "label label-success",
        limitReachedClass: "label label-danger"
    });
 }

$(document).ready(function() {
    setValidation(); // On page load
    dojo.subscribe('partialrefresh-complete', function(method, form, refreshId, options) {
        setValidation(); // On partial refresh
    });
});
Другие вопросы по тегам