Date Picker : Rest on next select

Question

I am using a package. Specifically this.

Everything works fine, I clicks on the date picker, I selects year, Then month and then date, And the picker closes.

But when it closes and i click on it again, Only the last day calendar shows, Meaning it doesn't starts over again from year.

What i want is that, It should starts over again from year to month to day.

Here is the JsFiddle

Here is my code :

<div class='input-group date' id='datetimepicker9'>
    <input type='text' class="form-control" />
    <span class="input-group-addon">
        <span class="glyphicon glyphicon-calendar"></span>
    </span>
</div>

Js :

$(function () {
    $('#datetimepicker9').datetimepicker({
        viewMode: 'years'
    });
});

Answer 1

From the datetimepicker issue tracker, issue 1897 there is a suggestion for a workaround.

Basically you add a timeout that resets the datetimepicker to years mode once it's been used once.

$(function () {
  $('#datetimepicker9').datetimepicker({
    viewMode: 'years'
  });

  $('#datetimepicker9').on('dp.hide', function(event){
    setTimeout(function(){
      $('#datetimepicker9').data('DateTimePicker').viewMode('years');
    },1);
  });  
});

fiddle