Features
This page helps you start working with DHTMLX Message and explore its functionality in depth.
How to start with DHTMLX Message
In this section you will learn how to initialize and show different types of message boxes on a page and how to integrate Message into your applications.
Message initialization
| Topic | Description |
|---|---|
| Basic initialization | Learn how to initialize a message on a page |
Types of DHTMLX Message
| Topic | Description |
|---|---|
| Message | The example shows how to display a message |
| Alert | The example shows how to display an alert box |
| Confirm | The example shows how to display a confirm box |
| Tooltip | The example shows how to display a tooltip |
Integration
| Topic | Description |
|---|---|
| Backend integration | Learn how to connect DHTMLX Suite to a backend (Demo) |
| Optimus | Learn how to use the DHTMLX Optimus framework to build DHTMLX-based apps (the recommended framework for apps with Suite components) |
| React integration | Learn how to use DHTMLX Message with React (Demo) |
| Angular integration | Learn how to use DHTMLX Message with Angular (Demo) |
| Vue integration | Learn how to use DHTMLX Message with Vue.js (Demo) |
How to configure Message
In this section you will learn how to configure alert and confirm boxes, set the position of a message box and a tooltip, and more.
| Topic | Description |
|---|---|
| Message box | Learn how to configure a message box (Example 1, Example 2) |
| Alert box | Learn how to configure an alert box (Example) |
| Confirm box | Learn how to configure a confirm box (Example) |
| Tooltip | Learn how to configure a tooltip (Example 1, Example 2) |
How to customize Message
In this section you will learn how to customize different types of message boxes.
| Topic | Description |
|---|---|
| DHTMLX Message customization | Learn how to customize DHTMLX Message |
| Message with HTML content | Learn how to display HTML content in a message box (Example) |
| Message system colors | The example shows how to change the color of a message box |
| Styling a message (custom CSS) | The example shows how to apply custom styles to a message box |
| Styling an alert (custom CSS) | The example shows how to apply custom styles to an alert box |
| Styling a confirm (custom CSS) | The example shows how to apply custom styles to a confirm box |
| Tooltip in light (white) color | The example shows how to customize a tooltip |
| List of CSS classes | The CSS classes included in the DHTMLX library |
How to work with a message box
In this section you will learn how to use the message box API.
| Topic | Description |
|---|---|
| Closing the message box | Learn how to close a message box |
API reference
In this section you will find the Message API reference.
| Topic | Description |
|---|---|
| Message box methods | Check the list of methods of a message box |
| Message box properties | Check the list of properties of a message box |
| Alert box properties | Check the list of properties of an alert box |
| Confirm box properties | Check the list of properties of a confirm box |
| Tooltip properties | Check the list of properties of a tooltip |
Common functionality
In this section you will learn about common library functionality that is useful when you work with Message.
| Topic | Description |
|---|---|
| Touch support | Learn how to work with touch support |
| TypeScript support | Learn how to work with TypeScript |
| Accessibility support | Learn about accessibility support in Message |
| AwaitRedraw | Learn how to run code after the component renders |
Any questions left?
Do you need more functionality? Feel free to share your suggestions in the comments below!