DHTMLX Suite 8.4 Release: API Updates for Grid/TreeGrid, Chart, Toolbar, ComboBox, and New Samples

JavaScript

DHTMLX Calendar - Suite UI Library

Name: Javascript Calendar - Date and Time Selection - DHTMLX Suite
Rating: 4.8 (34 reviews)

Versatile JavaScript calendar from DHTMLX Suite UI library with three views for quickly navigating dates and selecting time and date ranges.

Get free trial

Buy

Try JavaScript Calendar Live Demo

Open a demo on desktop

Top industry players use DHTMLX Suite for creating web apps of any complexity with minimum time and cost efforts.

Easily Adaptable JavaScript Calendar Component

User-friendly interface for date and time selection

Use the DHTMLX JavaScript calendar component to create a date and time selector by attaching it to a popup. Display the selected date in an input field. Add a second calendar thus allowing users to select date ranges.

Check the code snippet

Adjustable calendar for time management

Easily configure the Calendar widget and block or highlight dates, specify date format, display week numbers, set the initially selected date, and more due to its rich API.

Check the code snippet

Customizable UI

Change every aspect of the DHTMLX Calendar via CSS. Modify the background color and set non-standard colors to selected and highlighted dates, date ranges and calendar borders.

Check the code snippet

Check other features

Get free trial

How to Build a Simple Calendar in JavaScript

5 Quick Steps to Start Working with DHTMLX Suite UI Calendar:

Create an HTML file

Include the calendar js source files in the header

Add a container with an id - e.g. “calendar_container”

Initialize the widget with the dhx.Calendar object constructor

Specify a set of configuration properties if needed

Check documentation

JavaScript Calendar Control Integrations

Angular

Vue.js

React

Svelte

TypeScript

NodeJS

Check out all the DHTMLX integrations

DHTMLX Suite Demos with JavaScript/HTML Calendar

Light Skin

Choose light, dark, or high-contrast skins

View

Dark Skin

Choose light, dark, or high-contrast skins

View

Hotel Management System

Process room reservations

View

Hospital Management System (HMS)

Manage medical records

View

online examination system project in JavaScript

Online Exam System

Create and evaluate assignments

View

Theme Configurator

Configure your own theme using presets

View

JavaScript Calendar Picker with Date and Time Selectors

View more demos

Get free trial

Documentation

Consult documentation

In the documentation of the DHTMLX JavaScript calendar component, you'll find the API references and step-by-step guides to quickly initialize, configure, and integrate widgets with the backend and React, Svelte, Angular, and Vue.js frameworks.

Visit documentation

Samples

Work with code snippets

With the help of the code snippets, you can explore every JavaScript calendar feature. Online samples allow you to experiment with JavaScript and HTML code and share your results with the team or our tech support.

Visit samples

Free trial

Download Calendar free trial

We suggest you try out the functionality of the DHTMLX Calendar and download a free 30-day trial version. You’ll also get the latest updates and official technical support.

Visit free trial

Optimus

Use Optimus framework

DHTMLX Optimus is a JavaScript micro-framework you can use to develop DHTMLX-based web apps faster and with less need for coding.

Visit optimus

Official tech support

Get help from tech support

Being a trial user or an owner of a proprietary license, you can always get technical or licensing assistance. On this page, you’ll find available channels and resources for obtaining tech support.

Visit official tech support

Community forum

Browse DHTMLX forum

The forum has saved up lots of shared knowledge on working with DHTMLX JS UI widgets and in other other technologies. Our tech support team monitors topics and answers common questions.

Visit community forum

Open source

Get open-source version

This is the JavaScript Calendar component open source version under the GNU GPL v2 license for non-commercial projects. It comprises all the features from the Standard edition.

Visit open source

Templates

Apply CSS templates

On this page, you can learn how to quickly create a user-friendly JavaScript application with DHTMLX Suite in four steps and also find new CSS templates.

Visit templates

Blog

Check for updates

Our blog is a comprehensive resource where you can find out all the latest DHTMLX Suite releases, helpful tips, technical tutorials, case studies, and other company updates and offerings.

Visit blog

DHTMLX Calendar Licensing

	Individual	Commercial	Enterprise	Ultimate
License Terms	Individual Read License Agreement	Commercial Read License Agreement	Enterprise Read License Agreement	Ultimate Read License Agreement
Developers	Individual 1	Commercial 5	Enterprise 20	Ultimate
Projects	Individual 1	Commercial 1	Enterprise 5	Ultimate
Use in SaaS (unlimited end-users)	Individual	Commercial	Enterprise	Ultimate
Perpetual distribution rights	Individual	Commercial	Enterprise	Ultimate
Support Plan	Individual Standard Support	Commercial Premium Support	Enterprise Premium Support	Ultimate Ultimate Support
Time Period	Individual 1 year	Commercial 1 year	Enterprise 1 year	Ultimate 1 year
Updates	Individual Major, minor, and maintenance updates	Commercial Major, minor, and maintenance updates	Enterprise Major, minor, and maintenance updates	Ultimate Major, minor, and maintenance updates Priority queue for bug fixing
Support requests	Individual 10	Commercial 30	Enterprise 50	Ultimate
Response Time	Individual 72h	Commercial 48h	Enterprise 48h	Ultimate 24h
Personal Account Manager	Individual	Commercial	Enterprise	Ultimate