Sat. Dec 4th, 2021

Requirement: I have an af:inputDate component. Also, I have a list of holidays defined in a Managed Bean. Now I want to disable and highlight all the holidays in Red Color.

Solution: For the solution of the above requirement follow the steps as shown below:

Step 1: Create an ADF Fusion Web Application.

Step 2: Create a demo.jspx page.

Drag and drop af:panelBox inside the demo.jspx page and set text=”Show Holidays as Disabled and Highlighted” and showDisclosure=”false”

Drag and drop af:inputDate inside the af:panelBox and set label=”Select Date” and disabledDays=”#{pageFlowScope.MyBean}”

Thus, the complete code for the demo.jspx page is shown below:

<?xml version='1.0' encoding='UTF-8'?>
<jsp:root xmlns:jsp="" version="2.1" xmlns:f=""
    < contentType="text/html;charset=UTF-8"/>
        <af:document title="demo.jspx" id="d1">
            <af:form id="f1">
                <af:panelBox text="Show Holidays as Disabled and Highlighted" id="pb1" showDisclosure="false">
                    <af:inputDate label="Select Date" id="id1" disabledDays="#{pageFlowScope.MyBean}"/>
                    <f:facet name="toolbar"/>

And the complete code for the MyBean.Java class is shown below. The implements DateListProvider, and in the Overridden method I have defined a list that contains dates of holidays that I want to disable in the af:inputDate component.


import java.util.ArrayList;
import java.util.Calendar;
import java.util.Date;
import java.util.List;

import javax.faces.context.FacesContext;

import org.apache.myfaces.trinidad.model.DateListProvider;

public class MyBean implements DateListProvider {
    public MyBean() {

    public List<Date> getDateList(FacesContext facesContext, Calendar calendar, Date date, Date date2) {
        List<java.util.Date> holiDay = new ArrayList();
        holiDay.add(new Date("24-Jan-2021"));
        holiDay.add(new Date("25-Jan-2021"));
        holiDay.add(new Date("10-Feb-2021"));
        holiDay.add(new Date("26-Feb-2021"));
        holiDay.add(new Date("04-Mar-2021"));
        holiDay.add(new Date("20-Apr-2021"));
        holiDay.add(new Date("23-Apr-2021"));
        holiDay.add(new Date("24-Apr-2021"));
        holiDay.add(new Date("25-Apr-2021"));
        return holiDay;

Now, save all and run the application. Thus, the ran application is shown below:

Here we can see the dates 20, 23, 24,and 25 as disabled. Now, we will highlight these disabled dates with red color.

For this, let me create a skin1.css file in the ViewController Project and write the below code.

@charset "UTF-8";

/**ADFFaces_Skin_File / DO NOT REMOVE**/
@namespace af "";
@namespace dvt "";

af|chooseDate::regular-day:disabled {
    background-color: red;
    color: ButtonFace;

Now, save all and run the application. Thus, the ran application is shown below:

Hence, the solution to our requirement.

If you like the post please comment, share, and do join me on Facebook. Please subscribe to my YouTube Channel for video tutorials.

Thanks & Regards,
Susanto Paul

 577 total views,  1 views today

By Susanto Paul

Susanto is an Oracle ACE, a qualified MCA, MBA, and a highly-skilled Senior Oracle Specialist. He is an enthusiastic Blogger and YouTuber who helps learners to solve their complex problems more efficiently. He has 9+ years of experience in multiple technologies like AWS, Oracle ADF, Oracle APEX, Oracle JET, Oracle VBCS, Oracle IDCS, Oracle PL/SQL, Oracle Integration Cloud, Java, JDBC, Servlets, JSP, Spring, Hibernate, HTML5, CSS3, JavaScript, TypeScript, NodesJS, Angular, MySQL, Oracle WebLogic Server, JUnit, JMeter, Selenium Web Driver, etc. He is a certified: Oracle Certified Professional Java SE 6 Programmer, Oracle ADF 11g Certified Implementation Specialist, Oracle Cloud Platform Application Integration 2020 Certified Specialist, Oracle Cloud Infrastructure Foundations 2020 Certified Associate, and Oracle Cloud Infrastructure Developer 2020 Certified Associate

Leave a Reply

Your email address will not be published. Required fields are marked *