JSFiddle - React, Tailwind, and code Playground
by Alan Tsai
HTML
<link rel="stylesheet" href="http://code.jquery.com/ui/1.9.1/themes/base/jquery-ui.css" />
<script src="http://code.jquery.com/ui/1.9.1/jquery-ui.js"></script>
<label for="startYear"> Start Year: </label>
<input name="startYear" id="startYear" class="date-picker-year" />
JavaScript
$(function() {
$('.date-picker-year').datepicker({
changeYear: true,
showButtonPanel: true,
dateFormat: 'yy',
onClose: function(dateText, inst) {
var year = $("#ui-datepicker-div .ui-datepicker-year :selected").val();
$(this).datepicker('setDate', new Date(year, 1));
}
});
$(".date-picker-year").focus(function () {
$(".ui-datepicker-month").hide();
$(".ui-datepicker-calendar").hide();
});
});