Mobile-friendly Date Picker In Pure JavaScript – Cuppa DatePicker

Category: Date & Time , Javascript | November 8, 2016
Views Total:7,021 views
Official Page:Go to website
Last Update:November 8, 2016


Mobile-friendly Date Picker In Pure JavaScript – Cuppa DatePicker


Cuppa DatePicker is a simple flexible JavaScript library used for creating an input based date picker for both mobile and desktop web applications.

How to use it:

Load the necessary moment.js library in the webpage.

<script src="moment.min.js"></script>

Load the main JavaScript file ‘cuppa-calendar.js’ in the webpage.

<script src="js/cuppa-calendar.js"></script>

Create a container for the date picker.

<div id="demo"></div>

Create a new instance of the Cuppa DatePicker.

var cal  = new WinkelCalendar({
    container: 'demo'

Customization options with default values.

var cal  = new WinkelCalendar({
    defaultDate : new Date(),
    bigBanner: true,
    format : "DD/MM/YYYY",
    onSelect : null

API methods.

// Sets a new date
// Sets the date to todays's date
// Opens the datepicker
// Closes the datepicker

You Might Be Interested In:

Leave a Reply