I am trying to inject angular js datepicker into my project. i am done according to documentation. but there is nothing appear to visible date picker. I have created a plnkr plnkr
<!DOCTYPE html>
<html ng-app="plunker">
<head>
<meta charset="utf-8" />
<title>AngularJS Plunker</title>
<script>document.write('<base href="' + document.location + '" />');</script>
<link rel="stylesheet" href="style.css" />
<link rel="stylesheet" href="https://rawgit.com/g00fy-/angular-datepicker/master/app/styles/bootstrap.css">
<link rel="stylesheet" href="https://rawgit.com/g00fy-/angular-datepicker/master/dist/angular-datepicker.css" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.10.6/moment.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment-timezone/0.4.1/moment-timezone-with-data.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-bootstrap/0.6.0/ui-bootstrap-tpls.min.js"></script>
<script src="https://rawgit.com/g00fy-/angular-datepicker/master/app/scripts/datePicker.js"></script>
<script src="https://rawgit.com/g00fy-/angular-datepicker/master/app/scripts/datePickerUtils.js"></script>
<script src="https://rawgit.com/g00fy-/angular-datepicker/master/app/scripts/dateRange.js"></script>
<script src="https://rawgit.com/g00fy-/angular-datepicker/master/app/scripts/input.js"></script>
<script src="app.js"></script>
</head>
<body ng-controller="MainCtrl">
<input class="form-control" date-time ng-model="DateOfbirth" max-date="today" view="date" timezone="UTC" format="yyyy-MM-dd HH:mm">
</body>
</html>
doc ref. here
I had the same issue.
try to upgrade angular version to 1.5.X
some of the features that max/min date needed not includes in the lowest
angular versions.
I fixed my issue by adding custom $watch
.
$scope.$watch('addUserProfileData.DateOfbirth', validate_dateOfbirth);
function validate_dateOfbirth () {
if ( $scope.addUserProfileData.DateOfbirth != "" ) {
var selectedDate = moment($scope.addUserProfileData.DateOfbirth.toISOString()).format('DD/MM/YYYY');
var current_date = moment(moment().toISOString()).format('DD/MM/YYYY');
var momentA = moment(selectedDate,"DD/MM/YYYY");
var momentB = moment(current_date,"DD/MM/YYYY");
if (momentA >= momentB) {
$scope.addUserProfileForm.DateOfbirth.$setValidity("endBeforeStart", false);
} else {
$scope.addUserProfileForm.DateOfbirth.$setValidity("endBeforeStart", true);
}
}
}
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.