Bootstrap datetimepicker only month and year not working as intended

Question

My Datetime picker works on the fist click, but if I click again in the input field again it shows the picker with the day field. How can I do this? Any help will be appreciated.

This is the image in first click (expected behavior)

This is the image in second click (expected behavior is to come like to the first one)

My code is below

HTML

<div class='input-group' id='dpRM'>
    <input type='text' class="form-control form-control-1 form-input input-sm fromq" placeholder="Enter Month and year" />
    <span class="input-group-addon">
        <span class="fa fa-calendar"></span>
    </span>
</div>

Javascript

<script type="text/javascript">
    $(function() {
        $('#dpRM').datetimepicker({
            format: "MMMM YYYY",
            viewMode: "years",
            //minViewMode: 0,
            toolbarPlacement: "top",
            allowInputToggle: true,
            icons: {
                time: 'fa fa-time',
                date: 'fa fa-calendar',
                up: 'fa fa-chevron-up',
                down: 'fa fa-chevron-down',
                previous: 'fa fa-chevron-left',
                next: 'fa fa-chevron-right',
                today: 'fa fa-screenshot',
                clear: 'fa fa-trash',
                close: 'fa fa-remove'
            }
        });
    });
</script>

Thanks in advance

Answer 1

Try as follow

$('#dpRM').datetimepicker({
    viewMode : 'months',
    format : 'MM/YYYY',
    toolbarPlacement: "top",
    allowInputToggle: true,
    icons: {
        time: 'fa fa-time',
        date: 'fa fa-calendar',
        up: 'fa fa-chevron-up',
        down: 'fa fa-chevron-down',
        previous: 'fa fa-chevron-left',
        next: 'fa fa-chevron-right',
        today: 'fa fa-screenshot',
        clear: 'fa fa-trash',
        close: 'fa fa-remove'
    }
});

$("#dpRM").on("dp.show", function(e) {
   $(e.target).data("DateTimePicker").viewMode("months"); 
});

REF :: GitHub