uib-datepicker-popup Not showing picker in firefox or safari

Question

I been using the Ui angular bootstrap datepicker, and it's been working fine.... in chrome.

As it turn out, Firefox and safari won't show the datepicker. Anyone ever run into this before.

my HTML looks like this

 <p class="input-group">
       <input type="date" class="form-control" datepicker-popup ng-model="startDate" is-open="status.opened" min-date="minDate" max-date="maxDate" datepicker-options="dateOptions" date-disabled="disabled(date, mode)" close-text="Close" />
 </p>

And my JS/Controller looks like this

   $scope.today = function () {
        $scope.startDate = new Date();
        $scope.startDate.setMonth($scope.startDate.getMonth() - 1);
        $scope.endDate = new Date();
        $scope.endDate.setMonth($scope.endDate.getMonth() + 1);
    };
    $scope.today();

    $scope.clear = function () {
        $scope.dt = null;
    };

    // Disable weekend selection
    $scope.disabled = function (date, mode) {
        return (mode === 'day' && (date.getDay() === 0 || date.getDay() === 6));
    };


    $scope.open = function ($event) {
        $scope.status.opened = true;
    };

    $scope.setDate = function (year, month, day) {
        $scope.startDate = new Date(year, month, day);
        $scope.endDate = new Date(year, month, day);
    };

    $scope.dateOptions = {
        formatYear: 'yy',
    };

    $scope.formats = ['dd-MMMM-yyyy', 'yyyy/MM/dd', 'dd.MM.yyyy', 'shortDate'];
    $scope.format = $scope.formats[0];

    $scope.status = {
        opened: false
    };

As told before This works. But in firefox and safari, it's not showing the datepicker, but it does so in chrome.

Answer 1

Not sure which version of UI Bootstrap you are using but in 1.2.4 the datepicker markup looks like this:

<input type="text" class="form-control" uib-datepicker-popup ng-model="startDate" is-open="opened" ... />

tried your code in FF 44 and IE 11 - seems fine to me: http://plnkr.co/edit/deE1lR?p=preview