When I try to set the default date as the maximum date in a date input field, something strange happens. Initially, I select today's date as the value and everything works fine. However, if I clear the date by clicking on an 'x' icon, the value reverts to the default value of '1970-01-01'. When I try to select today's date again, my JavaScript code checks if the value is undefined and sets it back to the default value of '1970-01-01'. I'm puzzled as to why I can't select today's date after clearing it. This issue occurred when testing in a Chrome browser.
Here is the HTML code:
<!doctype html>
<html ng-app="app">
<head>
<script src="angular/angular.min.js"></script>
</head>
<body>
<div ng-controller="MainCtrl">
<input type="date" max="{{today}}" ng-model="myDate.date" ng-change="change()">
</div>
<script src="app.js"></script>
</body>
</html>
JavaScript code:
var app = angular.module('app', []);
app.controller('MainCtrl', ['$scope', function ($scope) {
$scope.myDate = {
date:null
}
$scope.today = '2016-03-14';
$scope.change = function(){
if(!$scope.myDate.date){
$scope.myDate.date = new Date('1970-01-01');
}
}
}]);
Please refer to the picture for more clarity.
View the live demo here.