JSFiddle - React, Tailwind, and code Playground
HTML
<script src="https://ajax.aspnetcdn.com/ajax/jquery.ui/1.10.1/jquery-ui.js"></script>
<link rel="stylesheet" href="https://ajax.aspnetcdn.com/ajax/jquery.ui/1.10.1/themes/blitzer/jquery-ui.min.css">
<label for="dateInput">Select date:</label>
<input id="dateInput" id="startDate" class="date-picker" />
<label for="dateInput">Date in 'change' event:</label>
<input id="dateShow" id="startDate" class="date-picker" />
<div id = "datenesto">
</div>
CSS
.ui-datepicker-calendar {
display: none;
}
JavaScript
$(function() {
$('.date-picker').datepicker({
dateFormat: 'MM yy',
changeMonth: true,
changeYear: true,
showButtonPanel: true,
onClose: function (dateText, inst) {
var month = inst.dpDiv.find('.ui-datepicker-month').find(':selected').val(),
year = inst.dpDiv.find('.ui-datepicker-year').find(':selected').val();
$(this).datepicker('setDate', new Date(year, month, 1)).change();
}
})
.change(function() {
var date = $(this).val();
$('#dateShow').val(date);
});
});
$(document).ready(function(){
$("#datenesto").html($('#dateInput').datepicker("getDate"));
});