Pick Month And Year With jQuery UI - jQuery monthpicker.js

A month picker jQuery plugin that extends the jQuery UI's datepicker widget to allow the users to pick only months and years.

See Also:

• jQuery Plugin For jQuery UI Month/Year Picker - mtz.monthpicker
• jQuery and jQuery UI Month & Year Selector Plugin

How to use it:

1. Load the necessary jQuery and jQuery UI in the document.

<link rel="stylesheet" href="/path/to/cdn/jquery-ui.min.css" />
<script src="/path/to/cdn/jquery.min.js"></script>
<script src="/path/to/cdn/jquery-ui.min.js"></script>

2. Download and load the month picker plugin after jQuery.

<script src="monthpicker.js"></script>

3. Create two input fields as follows:

<!-- Month Picker Input -->
<input class="js-monthpicker" type="hidden">

<!-- Alternative Input (The selected month/year will be placed here) -->
<input type="text" />

4. Initialize the month picker on document ready. That's it.

$(function(){
  $('.js-monthpicker').monthpicker();
});

5. Customize the month/year format. Default: 'M yy'.

$('.js-monthpicker').monthpicker({ 
  // e.g. May 2022
  altFormat: 'MM yy' 
});

6. Set the step length of the month when switching between years. Default: '12'.

$('.js-monthpicker').monthpicker({ 
  stepMonths: 6,
});

---

This awesome jQuery plugin is developed by tlemens. For more Advanced Usages, please check the demo page or visit the official website.