22 September 2014

Hide or Disable value in SelectOneChoice In ADF

Hi All,

I am going to show that how you can hide/disable the value present in SelectOneChoice component in ADF.

Suppose I have a department selectOneChoice LOV. Now I want to hide/disable  some of the value.


So suppose in above shown LOV I want to hide "Sales" option.

When you go to your page source you will see that the following code is generated for this SelectOneChoice in you jspx/jsff page.

  <af:selectOneChoice value="#{bindings.DepartmentId.inputValue}"
                              label="#{bindings.DepartmentId.label}"
                              required="#{bindings.DepartmentId.hints.mandatory}"
                              shortDesc="#{bindings.DepartmentId.hints.tooltip}"
                              id="soc1">
            <f:selectItems value="#{bindings.DepartmentId.items}" id="si1"/>
          </af:selectOneChoice>


So you have to slight modify the above code and hiding of value in SelectOneChoice will be done.

Modify your code as follows:

 <af:selectOneChoice value="#{bindings.DepartmentId.inputValue}"
                              label="#{bindings.DepartmentId.label}"
                              required="#{bindings.DepartmentId.hints.mandatory}"
                              shortDesc="#{bindings.DepartmentId.hints.tooltip}"
                              id="soc1">
           <af:forEach items="#{bindings.DepartmentId.items}" var="item">
                     <af:selectItem label="#{item.label}" id="si2" value="#{item.value}" rendered="#{item.label ne 'Sales'}"/>
            </af:forEach>

          </af:selectOneChoice>


so you have to replace the <f:selectItems> tags with <af:forEach> tag and inside that you have to use <af:selectItem>.

Once you run the page you will notice that "Sales" option is hidden now as shown below..



If you want to disable the option then you just have to replace the "rendered" property with disabled and condition should be replaced by eq instead of ne.

So suppose if you have to disable "Sales" , "Public Relations" and "IT" then your code should look like this.


 <af:selectOneChoice value="#{bindings.DepartmentId.inputValue}"
                              label="#{bindings.DepartmentId.label}"
                              required="#{bindings.DepartmentId.hints.mandatory}"
                              shortDesc="#{bindings.DepartmentId.hints.tooltip}"
                              id="soc1">
           <af:forEach items="#{bindings.DepartmentId.items}" var="item">
                       <af:selectItem label="#{item.label}" id="si2" value="#{item.value}" disabled="#{item.label eq 'Sales' || item.label eq 'Public Relations' || item.label eq 'IT'}"/>
            </af:forEach>

          </af:selectOneChoice>


So when you run your page again you can see that these options are disabled as shown below.




Happy coding :)

1 on: "Hide or Disable value in SelectOneChoice In ADF"