Features
This page contains structured information that will help you to start working with DHTMLX Timepicker and go into deep dive on its functionality.
How to start with DHTMLX Timepicker
In this section you can find out the ways of Timepicker initialization, and learn how to integrate Timepicker into your applications.
Initialization
| Topic | Description |
|---|---|
| Basic initialization | Learn how to initialize a Timepicker (Example) |
| Timepicker inside a Popup | Learn how to initialize a Timepicker in a popup (Example) |
| Timepicker in Calendar | Check the example of Timepicker as a part of Calendar |
| Timepicker in Form: example 1, example 2 | Check the examples of Timepicker as Form controls |
Integration
| Topic | Description |
|---|---|
| Backend integration | Learn how to connect DHTMLX Suite to a backend (Demo) |
| Optimus | Learn how to use DHTMLX Optimus framework for creating DHTMLX-based app (recommended framework for creating apps with Suite components) |
| React integration | Learn how to use DHTMLX Timepicker with React (Demo) |
| Angular integration | Learn how to use DHTMLX Timepicker with Angular (Demo) |
| Vue integration | Learn how to use DHTMLX Timepicker with Vue.js (Demo) |
How to configure Timepicker
In this section you can find out how to set the initial value of Timepicker, how to add buttons in the component, and how to configure the time format.
| Topic | Description |
|---|---|
| Setting the initial value | Learn how to specify the initial value of a Timepicker (Example) |
| Adding action buttons | Learn how to add Close and Save buttons into the timepicker |
| Configuring time format | Learn how to configure the format (12-hour or 24-hour) of displaying time in the timepicker (Example) |
How to customize Timepicker
In this section you can learn how to customize a Timepicker.
| Topic | Description |
|---|---|
| Styling Timepicker | Learn how to change the look and feel of Timepicker (Example) |
| List of CSS classes | A set of CSS classes provided by the DHTMLX library |
How to work with Timepicker
In this section you can learn how to set, get or clear the value of Timepicker.
| Topic | Description |
|---|---|
| Setting the value of Timepicker | Learn how to set the value for Timepicker dynamically (Example) |
| Getting the value of Timepicker | Learn how to get the current value of Timepicker (Example) |
| Clearing the value of Timepicker | Learn how to clear the value set in the timepicker (Example) |
How to work with Timepicker events
This section explains how to work with Timepicker events.
| Topic | Description |
|---|---|
| Event basic rules | Learn basic rules on how to work with events |
| Event handling | Learn how to attach, detach, or call the Timepicker events (Example) |
API reference
In this section you can find out corresponding references of Timepicker API.
| Topic | Description |
|---|---|
| Timepicker methods | Check the list of Timepicker methods |
| Timepicker events | Check the list of Timepicker events |
| Timepicker properties | Check the list of Timepicker properties |
Common functionality
In this section you will learn about common functionality of the library which can be useful while working with Timepicker.
| Topic | Description |
|---|---|
| Touch support | Learn how to work with touch support (Example) |
| TypeScript support | Learn how to work with TypeScript |
| AwaitRedraw | Learn how to perform the code after the component’s rendering |
Any questions left?
Do you need more functionality? Feel free to share your suggestions in the comments below!