0

我一直使用Ui角度引導datepicker,並且它在Chrome中一直工作正常。uib-datepicker-popup在Firefox或safari中未顯示選取器

事實證明,Firefox和safari不會顯示日期選擇器。任何人都曾經遇到過。

我的HTML看起來像這樣

<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> 

而我的JS /控制器看起來像這樣

$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 
    }; 

至於說這工作之前。但在Firefox和Safari瀏覽器中,它不顯示日期選擇器,但它在Chrome中顯示。

回答

0

不知道你所使用的的UI Bootstrap版本,但在1.2.4的日期選擇器的標記看起來是這樣的:

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

試圖FF 44和IE 11的代碼 - 似乎沒什麼問題:http://plnkr.co/edit/deE1lR?p=preview

+0

我也試過用uib-datepicker-popup。但我沒有按鈕來顯示彈出窗口。在我的代碼中,它只是輸入字段中的一個箭頭。也許這是使它工作的原因。會嘗試一下。馬上回復 – DaCh

+1

顯示出如果我使用type =「date」的類型,它的工作方式會有所不同。所以我把日期選擇器改回到uib-datepicker,並從日期輸入文本,現在它的工作。感謝 – DaCh

+0

顯然firefox和IE trie顯示他們自己的日期選擇器,如果輸入類型設置爲**日期** https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/date – user1859022

相關問題