Получение JSF-компонента с Javascript

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

<h:outputScript>
function suggestValue2() {
    var value2 = document.getElementById('value2').value;
    if (value2 == "") {
        document.getElementById('value2').value = document.getElementById('value1').value;
    }
}
</h:outputScript>

<h:inputText
    id="value1"
    onblur="suggestValue2();" />

<h:inputText
    id="value2" />

Проблема в том, что на самом деле это не работает. Фактические идентификаторы этих двух входных элементов имеют префикс с некоторыми значениями, генерируемыми JSF, которые заполняют вызовы getElementById. Какой лучший способ для меня выполнить то, что я пытаюсь сделать здесь?

Изменить: Я должен заметить, что это будет отображаться внутри составного компонента, который может появиться несколько раз на одной странице. JSF, динамически устанавливающий фактический идентификатор, представляет желаемое поведение.

Ответ 1

Привяжите компонент к виду,

<h:inputText binding="#{input1}" ... />

чтобы вы могли просто распечатать свой идентификатор клиента в другом месте в представлении UIComponent#getClientId().

<h:outputScript>
    var input1 = document.getElementById('#{input1.clientId}');
    // ...
</h:outputScript>

Как вы уже упоминали, что вы находитесь внутри составного компонента, может быть полезно знать, что собственный идентификатор клиентского компонента уже доступен через #{cc.clientId}. Таким образом, более рекомендуемая альтернатива:

<cc:implementation>
    <h:outputScript>
        var input1 = document.getElementById('#{cc.clientId}:input1');
        // ...
    </h:outputScript>
    ...
    <h:inputText id="input1" ... />
    ...
</cc:implementation>

См. также:

Интеграция JavaScript в составной компонент JSF, чистый способ

Ответ 2

Jsf использует концепцию "именования контейнеров", в которой говорится, что идентификатор не обязательно должен быть уникальным в пределах предоставленного контейнера. Если контейнер имеет идентификатор. Поэтому, если вы не даете Id контейнеру, jsf добавляет непредсказуемые значения перед элементом. С идентификатором для контейнера он становится контейнером: id элементов. И это можно использовать в JavaScript надежно