Search code examples
twitter-bootstrapgoogle-chromebootstrap-datetimepickerbootstrap-material-design

Google chrome suddenly started opening bootstrap time and date picker automatically


in my website, I had added bootstrapMaterialDatePicker for picking the date from calendar. Popup need to be opened once clicked on input field. It was working fine even few moments ago. But suddenly it has started opening the popup instantly after the page load without clicking on that specific input field in chrome browser. But all the other browsers it is working fine.

This is how my html field code is.

<input type="text" name="date" id="date" class="form-control text-left js-calendar-future" pattern="(0[1-9]|1[012])[- /](0[1-9]|[12][0-9]|3[01])[- /](19|20)\d\d" required="">

And this is how I had initialized the bootstrapMaterialDatePicker library

 $(document).ready(function() { 
 $('.js-calendar-future').bootstrapMaterialDatePicker({
    weekStart: 0, 
    time: false,
    minDate: new Date(),
    format: 'MM/DD/Y',
    triggerEvent: 'click',
});
});

Solution

  • So, finally after doing lost of research I found the solution. Just I had to remove triggerEvent: 'click', attribute. So this is my code which worked.

     $(document).ready(function() { 
       $('.js-calendar-future').bootstrapMaterialDatePicker({
       weekStart: 0, 
       time: false,
       minDate: new Date(),
        format: 'MM/DD/Y',
       triggerEvent: 'click',
     });
    });