Показать/скрыть h: inputText на выбор h: selectOneMenu

Question

Я использую JSF 1.1 и Ajax4jsf. Я хочу показать/скрыть <h:inputText> об изменении значения элемента <h:selectOneMenu> с именем «Цвета».

Например, если я выбрал значение «Красный» в <h:selectOneMenu>, тогда отобразите <h:inputText> для интенсивности цвета, выбранного в <h:selectOneMenu> (высокий, средний, низкий).

Я не уверен, следует ли использовать Ajax4jsf или простой JavaScript. Я бы предпочел использовать Ajax4jsf, но он слишком простой.

Answer 1

Взгляните на <a4j:support/>. Этот тег дает вам возможность обрабатывать различные события на стороне клиента, включая событие onchange.

Рассмотрим пример (взятый из приведенной выше ссылке):

<h:form id="planetsForm"> 
    <h:outputLabel value="Select the planet:" for="planets" /> 

    <h:selectOneMenu id="planets" value="#{planetsMoons.currentPlanet}" valueChangeListener="#{planetsMoons.planetChanged}"> 
     <f:selectItems value="#{planetsMoons.planetsList}" /> 
     <a4j:support event="onchange" reRender="moons" /> 
    </h:selectOneMenu> 

    <h:dataTable id="moons" value="#{planetsMoons.moonsList}" var="item"> 
    <h:column> 
     <h:outputText value="#{item}"/> 
    </h:column> 
    </h:dataTable> 
</h:form>