Date-Picker

Explore a simple example of a basic Calendar.js instance configured to run as a Date-Picker, demonstrating how to quickly set up and display an interactive date-picker.

Include Files

Make sure you include the following files:

<link rel="stylesheet" href="dist/calendar.js.css">
<script src="dist/calendar.min.js"></script>

Create DOM Element

Add a new DOM element to house the Calendar.js instance:

<input type="date" id="calendar" value="01/06/2025">

Create Calendar.js Instance

Run the following JavaScript to create a new Calendar.js instance:

const calendarInstance = new calendarJs( "calendar" );

Result