In my project, i have to show in the jquery (angular-jquery-datepicker) date picker, the date formatted in the correct way for the user in his/her zone. I'm able to show in USA and EU format. When the user set those dates i have to save it with the toISOString to the database. However, for the USA no problem at all works fine. For the EU formatting, I'm receiving the error posted in the title and i'm sharing the entire error:
RangeError: Invalid time value
at Date.toISOString (<anonymous>)
at n.$scope.save (scripts.js:2826)
at angular.js:12474
at f (angular.js:21700)
at n.$eval (angular.js:14570)
at n.$apply (angular.js:14669)
at HTMLButtonElement.<anonymous> (angular.js:21705)
at HTMLButtonElement.dispatch (jquery.min.js:3)
at HTMLButtonElement.r.handle (jquery.min.js:3)
I have no idea why for USA date is working and for EU is not. I cannot understand why for one date is working but not for the other one.
Below i'm sharing the piece of code which gives that error:
$scope.save = function() {
if ($scope.banner.fromText != null && $scope.banner.toText != null) {
$scope.banner.from = new Date($scope.banner.fromText);
$scope.banner.to = new Date($scope.banner.toText);
$scope.banner.to.setHours(23, 59, 59)
$scope.banner.from = $scope.banner.from.toISOString()
$scope.banner.to = $scope.banner.to.toISOString()
}else{
$scope.banner.to = null
$scope.banner.from = null
}
I'm using in the code $filter('date')(value.item.from, 'shortDate');
However, if you need to see something extra for understanding this error please let me know what i should post to have a better look on it
My date picker directive:
'use strict';
angular.module('angular-jquery-datepicker', []).factory('datepicker',
[function() {
return $.datepicker;
}]).provider('$datepicker', function() {
return {
setDefaults: function(language) {
$.datepicker.setDefaults($.datepicker.regional[language]);
},
$get: function() {
return {
}
}
}
}).directive('jqdatepicker', function() {
return {
restrict: 'A',
require: 'ngModel',
link: function(scope, element, attr, ctrl) {
element.datepicker({
//dateFormat: 'dd-mm-yy',
autoclose: true,
changeMonth: true,
changeYear: true,
maxDate: Date.today(),
showOn: "both",
buttonImage: "/img/calendar-o.png",
onSelect: function(date) {
ctrl.$setViewValue(date);
ctrl.$render();
scope.$apply();
}
});
}
};
/*Datepicker for banner - extended main datepicker*/
}).directive('jqdatepickerbanner', function() {
return {
restrict: 'A',
require: 'ngModel',
link: function(scope, element, attr, ctrl) {
//scope.customStartDate = today;
element.datepicker({
//dateFormat: 'dd-mm-yy',
changeMonth: true,
changeYear: true,
//maxDate: '+6mm', // 6 Months max date --> For set the maximum period the Banner can be set up
minDate: Date.today(),
showOn: "both",
buttonImage: "/img/calendar-o.png",
onSelect: function(date) {
if (this.id === "startDateBanner") {
$("#endDateBanner").datepicker("option", "minDate", date);
}
ctrl.$setViewValue(date);
ctrl.$render();
scope.$apply();
}
});
}
};
});