Dynamic disable validator when click checkbox

Question

I got one number validator and one checkbox in my jsf. When a checkbox is selected then the number validator will check validation. When checkbox is unselected, the validation will skip it.

Please see my code

<h:outputText value="#{trancheResources.label_enable}:" />
<p:selectBooleanCheckbox id="enableCheckBox" itemLabel="#{trancheResources.label_yes}" value="#{trancheBean.enableCheck}" disabled="#{trancheBean.readonly}">

</p:selectBooleanCheckbox>

<p:outputLabel for="acceptableMinVal" value="#{trancheResources.label_acceptableMinVal}:" />
<pe:inputNumber id="acceptableMinVal" value="#{trancheBean.trancheValidation.podMin}" disabled="#{trancheBean.readonly}" maxValue="999"
                required="#{trancheBean.requiredIfEnableCheck}" requiredMessage="#{trancheResources.label_acceptableMinVal} is required.">
    <f:validateDoubleRange disabled="#{trancheBean.cValidation}" minimum="1.00" />
</pe:inputNumber>

<p:outputLabel for="acceptableMaxVal" value="#{trancheResources.label_acceptableMaxVal}:" />
<pe:inputNumber id="acceptableMaxVal" value="#{trancheBean.trancheValidation.podMax}" disabled="#{trancheBean.readonly}" maxValue="999"
                required="#{trancheBean.requiredIfEnableCheck}" requiredMessage="#{trancheResources.label_acceptableMaxVal} is required.">
    <p:ajax event="keyup"  listener="#{trancheBean.acceptableMaxValOnkeyup}" ></p:ajax>
</pe:inputNumber>

<p:outputLabel for="exceptionMinVal" value="#{trancheResources.label_exceptionMinVal}:" />
<pe:inputNumber id="exceptionMinVal" value="#{trancheBean.trancheValidation.podExceptionMin}" disabled="#{trancheBean.readonly}" maxValue="999"/>

<p:outputLabel for="exceptionMaxVal" value="#{trancheResources.label_exceptionMaxVal}:" />
<pe:inputNumber id="exceptionMaxVal" value="#{trancheBean.trancheValidation.podExceptionMax}" disabled="#{trancheBean.readonly}" maxValue="999"/>

Please guide me to a solution. I have no idea on how to solve this.

Answer 1

I'll provide you with this sample answer and you can use it to apply it to yours. This approach is based on Pankaj Kathiriya's comment since that seems to be what you want to do.

In the sample code below, you have two <h:inputText> (substitute this component with yours <pe:inputNumber>). Their rendered attribute value will change every time you check/uncheck the <p:selectBooleanCheckBox>. When rendered evaluates to true, the <h:inputText> with validation will appear, the one without validation disappears (and vice versa).

The <selectBooleanCheckBox> will fire a ValueChangeEvent every time you check/uncheck it. You also need to make sure to set immediate to true so that it can be processed first (one phase before). Then call renderResponse in your listener to skip the remaining life cycles. Validation will kick in for the <h:inputText> with validation if you don't and you will see a validation error message when the switch occurs. Finally, for the <h:selectBooleanCheckBox>, you want to submit the form when the selection/deselection occurs. This can be done with javascript by setting its onchange attribute to submit() (e.g. onchange = "submit()"). Try to run the code so this could all make sense.

Again, keep in mind this is just a sample to help guide you to your solution.

public class SampleBean {
    private boolean renderValidatedForm; 
    private String firstInput; 
    private String secondInput; 

    //Constructor ommitted 
    //Setters and getters ommitted 

    public void toggleRender(ValueChangeEvent e) {
        boolean valueCheck = (Boolean) e.getNewValue(); 
        renderValidatedForm = valueCheck; 
        FacesContext.getCurrentInstance().renderResponse();
    }
}

The xhtml

<h:form>
    <h:panelGrid>
        <h:panelGroup>
            <h:outputLabel for="enableCheckBox" value="Check to view form with validation"/>
            <p:selectBooleanCheckbox id="enableCheckBox" value="#{sampleBean.renderValidatedForm}" 
                                     onchange="submit()" 
                                     valueChangeListener="#{sampleBean.toggleRender}"
                                     immediate="true"/>
        </h:panelGroup>
        <h:panelGroup>
            <h:outputLabel for="withValidation" value="Form with validation" 
                           rendered="#{sampleBean.renderValidatedForm}"/>
            <h:inputText id="withValidation" value="#{sampleBean.firstInput}" 
                         required="true" rendered="#{sampleBean.renderValidatedForm}"/>
            <h:message for="withValidation"/>
        </h:panelGroup>
        <h:panelGroup>
            <h:outputLabel for="noValidation" value="Form without validation" 
                           rendered="#{!sampleBean.renderValidatedForm}"/>
            <h:inputText id="noValidation" value="#{sampleBean.secondInput}" 
                         rendered="#{!sampleBean.renderValidatedForm}"/>
        </h:panelGroup>
    </h:panelGrid>
    <h:commandButton value="Submit"/>
</h:form>