month-picker-plugin

A Simple Month Picker Plugin in Vanilla JavaScript

by

Month picker is a simple plugin implemented in vanilla JavaScript. Inspired by jQuery UI Month Picker by KidSysco, without any 3rd party dependencies.

javascript month picker, month picker, css month picker, month picker jquery, month picker is not a function, month and year picker in javascript

How to make use of it:

1. Import the month picker plugin’s information into the doc.

<script src="./dist/vanilla-monthpicker.js"></script>
<link href="./dist/vanilla-monthpicker.css" rel="stylesheet" />

2. Attach the month picker to an input field.

<input type="date" id="myMonthPicker" value="2021-04-30" />
const myPicker = new MonthPicker(document.getElementById('myMonthPicker'), {
      // options here
});

3. Specify the variety of months to point out per row.

const myPicker = new MonthPicker(document.getElementById('myMonthPicker'), {
      nbMonthPerRow: 2
});

4. Determine whether or not to close the month picker after choice.

const myPicker = new MonthPicker(document.getElementById('myMonthPicker'), {
      closeOnSelect: false
});

5. Set the min/max dates (js object).

const myPicker = new MonthPicker(document.getElementById('myMonthPicker'), {
      minDate: {},
      maxDate: {},
});

6. Determine whether or not to cover the original input field.

const myPicker = new MonthPicker(document.getElementById('myMonthPicker'), {
      noNewElement: true
});

Minimal Month Picker, Month Picker Plugin/Github, bootstrap month picker, multiple month picker jquery

See Demo And Download

Demo & Download

Official Website(qpincon): Click Here

This superior jQuery/javascript plugin is developed by qpincon. For extra Advanced Usages, please go to the official website.

Leave a Comment