Description:
Renders a time selection control.
Inputs
- FormID - Name of the widget generated by FlowWright (read-only field)
Design:
![](https://static.helpjuice.com/helpjuice_production/uploads/upload/image/8802/direct/1626695695728-1626695695728.png)
Example:
Let’s build and execute the “TimeWidgetDef” example.
- Create a new form definition called “TimeWidgetDef.”
- Select the Open Designer checkbox and click the “Create” button
- Drag a Time widget to the canvas
- Double-click on the Time widget to view the input/properties. The popup window will appear as shown in the below graphic
![](https://static.helpjuice.com/helpjuice_production/uploads/upload/image/8802/direct/1626695761616-1626695761616.png)
- Select the relevant time zone from the drop-down
- Click on the Save button to confirm the changes
- Double-click the “Hour” drop-down widget to configure the “Static” properties.
![](https://static.helpjuice.com/helpjuice_production/uploads/upload/image/8802/direct/1626701002290-1626701002290.png)
- Double-click the “Hour” drop-down widget to configure the “Database” properties.
![](https://static.helpjuice.com/helpjuice_production/uploads/upload/image/8802/direct/1626701012483-1626701012483.png)
- Double-click the “Hour” drop-down widget to configure the “Role” properties.
![](https://static.helpjuice.com/helpjuice_production/uploads/upload/image/8802/direct/1626701023279-1626701023279.png)
- Double-click the “Hour” drop-down widget to configure the “Lookup” properties.
![](https://static.helpjuice.com/helpjuice_production/uploads/upload/image/8802/direct/1626701033399-1626701033399.png)
- Click on the Conditions tab and configure the inputs as shown in the graphic below. Add display condition. Type in the field name to control the display.
![](https://static.helpjuice.com/helpjuice_production/uploads/upload/image/8802/direct/1626701540274-1626701540274.png)
- Click on the Styling tab and configure the inputs as shown in the below graphic.
![](https://static.helpjuice.com/helpjuice_production/uploads/upload/image/8802/direct/1626701715950-1626701715950.png)
- Click on the Other tab and configure the inputs as shown in the graphic below.
![](https://static.helpjuice.com/helpjuice_production/uploads/upload/image/8802/direct/1626701769230-1626701769230.png)
- Double-click on the Meridiem widget to configure the inputs as shown in the graphic below
![](https://static.helpjuice.com/helpjuice_production/uploads/upload/image/8802/direct/1626701953423-1626701953423.png)
- Click on the Save button and Close the popup window
- Navigate to the UI menu and Preview the form. The rendered widget will appear as shown in the below graphic.
![](https://s3.amazonaws.com/helpjuice-static/helpjuice_production%2Fuploads%2Fupload%2Fimage%2F8802%2Fdirect%2F1618254407877-1618254407877.png)