Using the inputDate component

The inputDate component presents a text input field for entering dates and a button for picking dates from a pop-up calendar.

In this recipe, we will add an inputDate component to the Employees form created in the first recipe to show the Hire Date attribute.

How to do it...

In order to add the inputDate component, follow the ensuing steps:

1. Open the inputComponents.jsf page.

2. Drag the HireDate attribute under EmployeesView1 in Chapter4AppModuleDataControl from the Data Control pane and drop it inside the panel form layout.

3. Select Date from the drop-down menu and select Date Input w/Label.

4. Save everything.

5. Run the inputComponets.jsf page. You should now see the output as shown in the following screenshot:

   

How it works...

The inputDate component is used to make it easier for the user to enter a date at runtime. There is also a complementary component called the chooseDate component that can be used along with inputDate to allow the user to quickly select a date value without...