Main Menu


 
Partners
Want to see your brand name here? Contact us
  
Get the Code
Download the latest version:
API & Docs
View the complete API documentations and examples:
Licensing
We offer two types of licenses, personal and commercial. Find out more.
Donate
We thrive on your donations. If our scripts has helped, please donate.

JavaScript Calendar Component

JavaScript Calendar Component There are a lot of JavaScript Calendars out there, but actually only a few can be very customizable to fit everyone's need. That's why we have created a JavaScript Calendar Component that is very customizable and extendable. You can see our calendar at work right in this page.

Build Your Calendar Online

Build Your Calendar Online Don't want to go through all the API documentations? We got the solution for you, now you can customize your own calendar using our online builder. Simply change what you want and you'll get all the code right away. You can also save your work for reference.

Features

  • Create any numbers of months per calendar.
  • Set the weekend, days off, holidays (dates off), start day of the week.
  • Start and end date.
  • Multi selection with limits or without.
  • Skinnable (using CSS).
  • Can have any number of calendars in any page.
  • Optimized for best performance.

Useful Links

Examples

Creating a Basic Calendar (View Code)
Creating Multi Month Calendar (View Code)
In this example, will create a multiple months and multiple selection calendar.
Keyboard Navigation
Because the description of this example is long, we only included the title here. Click on the title to see the calendar and code.
Multiple Languages (View Code)
In this example, we'll create multiple calendars in different languages. This example is not available in the Lite version because additional languages are not loaded.
Dutch:
 Arabic:

Chinese:
Range Calendar (View Code)
In this example, we'll create a range selection tool (start date and end date). This example requires the full version.
Start Date:

End Date:
Shared Calendar (View Code)
In this example, we'll create a single calendar that is shared by multiple input fields. This can be useful in an editable grid or if there are too many dates input fields.
Date:
Date:
Date:
Date:
Date: