Search code examples
javascriptjqueryangularjseonasdan-datetimepicker

How to show always days on datepicker when is open?


I'm using eonasdan-bootstrap-datetimepicker:

<input type="text" class="form-control" ng-model="$ctrl.date" id="dateStart">
<script type="text/javascript">
    $("#dateStart").datetimepicker({
    format: 'ddd, D MMMM YYYY',
    showTodayButton: true
    });
</script>

What I want to achieve is that everytime I close the picker and reopen it I'll always have the days picker. Right now If I'm in the "datepicker-months" and click outside, the picker will close and if I reopen it it will show the months view again, but I want the days one.

I tried with:

on('dp.show', function(e) {
    $(".datepicker-days").show();
    $(".datepicker-months").hide();
    $(".datepicker-years").hide();
    $(".datepicker-decades").hide();
});

This ways looks like it's working: if I close it during months view and reopen it I'll get the days datepicker, but if from here I click on the month again I'll get the datepicker-years..

Any help would be appreciated.

EDIT: Code here: http://jsfiddle.net/xrqkyypd/51/


Solution

  • The answer is pretty much straightforward using events and viewMode function.

    You only must check that when the picker get hide then you reset his viewMode to which ever you want, in this case the days view.

    $('#myDatepicker').on('dp.hide', function(e) {
      $('#myDatepicker').data("DateTimePicker").viewMode('days')
    });