Open Material Datepicker on page load

Question

I want to open the bootstrap material datetimepicker on page load, how I can do that. I have tried many options like triggering the button page onload. It does open if I manually click on the button. Here is the code I have written:

<input type="button" id="date" class="form-control floating-label" placeholder="Date">

<script type="text/javascript";>
    var minDate = new Date();
    var numberOfMinDaysToAdd = 1;
    var maxDate = new Date();
    var numberOfMaxDaysToAdd = 15;
    maxDate.setDate(maxDate.getDate() + numberOfMaxDaysToAdd);  
    $( document ).ready(function(){ 
        $('#date').bootstrapMaterialDatePicker({
        format: 'dddd DD MMMM YYYY - HH:mm',
        minDate : minDate,
        maxDate : maxDate,
    });
        $.material.init();
        $('#date').trigger("click");
    });
</script> 

I have gone through the documentation part, but nothing helps. The Datepicker URL is here

Answer 1

The default trigger event seems to be focus. So use :

$('#date').focus()

If it didn't work, also try:

$('#date').focus().focus()