JSFiddle - React, Tailwind, and code Playground

by Guruprasad Rao

HTML

<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css">
<link rel="stylesheet" href="http://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.3.0/css/datepicker.min.css">
<script src="//netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.3.0/js/bootstrap-datepicker.js"></script>
<div class="input-group date" style="width: 200px">
    <input type="text" id="example1" class="form-control" style="cursor: pointer"/>
        <span class="input-group-addon">
            <i class="glyphicon glyphicon-calendar"></i>
        </span>
</div>

CSS

body
{
    margin: 10px;
}

.datepicker-switch
{
    pointer-events: none;
}

JavaScript

var date=new Date();
var year=date.getFullYear();
var month=date.getMonth();

$('#example1').datepicker
({
    format: "MM yyyy",
    minViewMode: 1,
    autoclose: true,
    startDate: new Date(year, month, '01'),
    endDate: new Date(year+1, month, '31')
});