Home

The jQuery UI Month Picker Docs

Welcome to the The jQuery UI Month Picker Wiki Documenation. There are numerous links on the right leading to implementation articles, options, events and API call docs.

Upgrading from version 2.x.x?

Please read the 3.x Upgrade Guide

Prerequisites

This plugin has been tested using the following configuration.

• jQuery 1.11.3
• jQuery UI 1.11.4
  • jQuery UI Widget Factory required
  • .button() plugin required
  • .datepicker() plugin required
  • .position() plugin optional (highly recommended see Position option)
• (optional) Digital Bush Masked Input jQuery Plugin

Installation

Attach all required CSS and JS files to the web page as follows...

<link href="http://code.jquery.com/ui/1.10.2/themes/smoothness/jquery-ui.css" media="all" rel="stylesheet" type="text/css" />
<link href="css/MonthPicker.min.css" media="all" rel="stylesheet" type="text/css" />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js" type="text/javascript"></script>
<script src="http://code.jquery.com/ui/1.10.2/jquery-ui.js" type="text/javascript"></script>
<script src="https://raw.github.com/digitalBush/jquery.maskedinput/1.3.1/dist/jquery.maskedinput.min.js" type="text/javascript"></script>
<script src="MonthPicker.min.js" type="text/javascript"></script>

Source Code Example

This plugin can only be called on a div, span, text input, or the HTML 5 Month Input Types as follows.

$('#TextBox1').MonthPicker({ StartYear: 2020, ShowIcon: false });
$('input[type=month]').MonthPicker().css('backgroundColor', 'lightyellow');