one inputtext diable 4 other input text and any of the 4 disable the one

Question

I have 5 inputtext in my jsf page. I want to achieve this functionality that If some text in entered in first inputtext, rest 4 should be disabled. And if any text is entered in any of the remaining 4 inputtexts then the 1st inputtext should be disbaled. I am quite new to jsf and don't know how to do this. Anyone please help.

Answer 1

In JSF 2 you can do it by this.

<h:inputText id="inputOne" value="#{bean.value1}" disabled="#{not empty bean.value2}">
    <f:ajax event="keyup" render="inputTwo"/>
</h:inputText>
<h:inputText id="inputTwo" value="#{bean.value2}" disabled="#{not empty bean.value1}">
    <f:ajax event="keyup" render="inputOne"/>
</h:inputText>

If you have a lot of fields, it is better to introduce method in #{bean} to perform all checks in more simple way than #{not empty bean.value1 and not empty bean.value2 and not empty bean.value3}

In case of many grouped inputs that should be disabled, you can either list them space separated in render attribute of <f:ajax> tag or group them with <h:panelGroup/> and render the whole group.

<h:inputText id="inputOne" value="#{bean.value1}" disabled="#{not empty bean.value2 and not empty bean.value3 and not empty bean.value4}">
    <f:ajax event="keyup" render="inputs"/>
</h:inputText>
<h:panelGroup id="inputs">
    <h:inputText value="#{bean.value2}" disabled="#{not empty bean.value1}">
        <f:ajax event="keyup" render="inputOne"/>
    </h:inputText>
    <h:inputText value="#{bean.value3}" disabled="#{not empty bean.value1}">
        <f:ajax event="keyup" render="inputOne"/>
    </h:inputText>
    <h:inputText value="#{bean.value4}" disabled="#{not empty bean.value1}">
        <f:ajax event="keyup" render="inputOne"/>
    </h:inputText>
</h:panelGroup>