Welcome to OGeek Q&A Community for programmer and developer-Open, Learning and Share
Welcome To Ask or Share your Answers For Others

Categories

0 votes
549 views
in Technique[技术] by (71.8m points)

validation - Conditionally make inputs required depending on checkbox value

On my JSF page, I have a HTML input checkbox where allows users to choose if they want the gift or not, and the <div> section under the checkbox information will only be displayed if the checkbox is checked. Once the checkbox is checked, users will be required to select an option (from a dropdown menu, initial value of dropdown menu = null); however, the selection is not required if the checkbox is not checked.

So, here comes two conditions:

A. Checkbox is checked ( == div view is played)

  1. user pick an option -> okay
  2. user do not select anything -> I want the required message to be displayed, and this is what I have done:

    <p:message style="margin: 10px" id="messages7" for="npsScoreSupport" />
    <h:selectOneMenu id="npsScoreSupport" value="#{npsBean.supportScore}" required="true" requiredMessage="Please select an option">
        <f:selectItems value="#{npsBean.ratingPickList}" />
    </h:selectOneMenu>
    

B. Checkbox is unchecked (== div view is hidden)

  1. User do not selection anything -> okay, but the page still requires users to pick an option as I have the required= "true".

Since I need the requireMessage to make sure an option is picked when the checkbox is checked, I am wondering if it is possible to make the requireMessage conditional based on the state of checkbox? (require when checkbox is checked, and not required when unchecked) any suggestion?

============updated======================

So now I have updated my checkbox and connects it with a function in JAVA class (boolean variable check = true as default)

<h:selectBooleanCheckbox class="someClass" value="#{someBean.check}" />

And here is my selector

<h:selectOneMenu id="OptSelector" value="#{someBean.Opt}" required="#{someBean.check}" requiredMessage="Please select and option">
                                                <f:selectItems value="#{npsBean.OptPickList}" />

The submission failed even when the checkbox is unchecked, it seems like the boolean check never changes. Anyone know why?

See Question&Answers more detail:os

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome To Ask or Share your Answers For Others

1 Reply

0 votes
by (71.8m points)

Just let the required attribute of the menu check if the checkbox is checked. You can do it by binding the physical checkbox component to the view by binding attribute, which would make it to end up in an UIInput instance which in turn has getValue() method returning the submitted/converted/validated value.

<h:selectBooleanCheckbox binding="#{checkbox}" ... />
<h:selectOneMenu ... required="#{checkbox.value}" />

(note: the code is complete as-is, you do not need to bind it to a bean property!)

Note that this doesn't strictly "conditionally display the message" as you explicitly asked. It just conditionally validates the input as required. Whether the message is being displayed or not is merely a consequence.

See also:


Update: as per your attempt to check the <h:selectBooleanCheckbox value> instead, this won't work as this value is only updated during update model values phase, which is after the validations phase when the required attribute is to be checked.


与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
OGeek|极客中国-欢迎来到极客的世界,一个免费开放的程序员编程交流平台!开放,进步,分享!让技术改变生活,让极客改变未来! Welcome to OGeek Q&A Community for programmer and developer-Open, Learning and Share
Click Here to Ask a Question

1.4m articles

1.4m replys

5 comments

57.0k users

...