Mobile-friendly Date Picker In Pure JavaScript – Cuppa DatePicker

Category: Date & Time , Javascript | November 8, 2016
Author:CuppaLabs
Views Total:6,447 views
Official Page:Go to website
Last Update:November 8, 2016
License:MIT

Preview:

Mobile-friendly Date Picker In Pure JavaScript – Cuppa DatePicker

Description:

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
cal.setDate('07-11-2016')

// Sets the date to todays's date
cal.today()

// Opens the datepicker
cal.today()

// Closes the datepicker
cal.close()

You Might Be Interested In:


Leave a Reply