Can not compare date using Angular.js

Question

I need one help.I need to compare todays date with future date using Angular.js . I am explaining my code below.

$scope.getFutureDate = function() {
    var today = new Date();
    var dd = today.getDate();
    var mm = today.getMonth() + 1; //January is 0!

    var yyyy = today.getFullYear();
    if (dd < 10) {
        dd = '0' + dd
    }
    if (mm < 10) {
        mm = '0' + mm
    }
    var today = dd + '-' + mm + '-' + yyyy;
    return today;
}

$scope.addPlanData = function() {
    var today = $scope.getFutureDate();
    if (today < $scope.date) {
        alert('Please select todays date or previous date');

    }
}

Here my requirement is when todays date will less than future date it will show me the alert message.In this code its happening only within the month.But if i will compare with like this 30-11-2015 with 1-12-2015,its not showing any alert message.Please help me.

score 1 · Accepted Answer · edited Nov 30 '15 at 10:55

1

You need to manipulate string to create date.

Try this

$scope.addPlanData=function(){
 var today= new Date();
 if(today < new Date($scope.date.split("-").reverse().join(",")){
            alert("Please select today's date or previous date");
        }
}

It gives you alert when user select future date which is greater than today. If you want alert when user select past date then use > in if condition.

edited Nov 30 '15 at 10:55

Vivek

11,938
19
92
127

answered Nov 30 '15 at 10:37

Jay Shukla

5,794
8
33
63

@subhra while this works, you should still consider to write a parse function for that date-format if you need it in other places as well. – wullxz Nov 30 '15 at 11:05

Vivek · Answer 2 · 2015-11-30T10:47:35.500

0

Try this

$scope.addPlanData=function(){
 var today= new Date();

 var dateArray = $scope.date.split("-");
 $scope.date = new Date(dateArray[2], dateArray[1] - 1, dateArray[0]);

 if(today < $scope.date){
            alert('Please select today or previous date');
        }
}

The relational operators < <= > >= can be used to compare JavaScript dates.

edited Nov 30 '15 at 10:47

answered Nov 30 '15 at 10:23

Vivek

11,938
19
92
127

@ VVK : `$scope.date` ,I am getting date from calender. – Nov 30 '15 at 10:30
and i am also getting like this format `dd-mm-yyyy`. – Nov 30 '15 at 10:31
its a sting because i am using datepicker. – Nov 30 '15 at 10:32
No,its changing my date format and also not checking. – Nov 30 '15 at 10:39

iulian · Answer 3 · 2015-11-30T10:40:52.760

Solution 1

When you compare dates as strings, the comparison takes one char at a time, and because in your example 3 is greater than 1 (even if 30-11-2015 is a smaller date than 1-12-2015), the result is greater for the november date. If you want to stick to string representations of dates, change the format of date to YYYY-MM-DD, so that you'll have the year compared first, then the month, then the day. In this situation you'll have 2015-12-01 greater than 2015-11-30, because the comparison will stop at the 2 from the units digit of the month.

$scope.getFutureDate = function () {
    var today = new Date();
    var dd = today.getDate();
    var mm = today.getMonth() + 1; //January is 0!

    var yyyy = today.getFullYear();
    if ( dd < 10 ) {
        dd = '0' + dd;
    } 
    if ( mm < 10 ) {
        mm = '0' + mm;
    } 
    return yyyy + '-' + mm + '-' + dd;
}

$scope.addPlanData = function () {
    var today = $scope.getFutureDate();
    if ( today < $scope.date ) {
        alert('Please select todays date or previous date');
    }
}

Solution 2

You can compare dates directly. In this care you need to cast your $scope.date variable to Date format by $scope.date = new Date($scope.date) and compare it with new Date(). This method gives you less code, as you don't need the getFutureDate method.

$scope.addPlanData = function () {
    if ( new Date() < new Date($scope.date) ) {
        alert('Please select todays date or previous date');
    }
}

@ iulian : But my insert date format is `dd--mm-yyyy`.Will it be fine ? I will prefer solution 1. — , Nov 30 '15 at 10:42
what datepicker module do you use? if you use the datepicker from angular-ui-bootstrap, you can specify the date format you would like the date to be in. although I think the actual value is a `Date` object, isn't it? — iulian, Nov 30 '15 at 10:46
i am using `720kb.datepicker` and i need the format `dd-mm-yyyy` finally. — , Nov 30 '15 at 10:48

wullxz · Answer 4 · 2015-11-30T11:06:49.047

It seems like you want to parse a Date from a custom format (dd-mm-yyyy).
I'd recommend to use a dedicated function to parse that date format, especially if you need to parse that kind of date format in more than this case:

function parseDate(dateString) {
    var date = new Date();
    // reset time to 0:00:00
    date.setUTCHours(0);
    date.setUTCMinutes(0);
    date.setUTCSeconds(0);

    var parts = dateString.split("-");
    date.setUTCDate(parts[0]);
    date.setUTCMonth(parts[1]);
    date.setUTCFullYear(parts[2]);

    return date;
}

And use it like this:

$scope.addPlanData = function() {
    var today = new Date();
    if (today < parseDate($scope.date)) { // parse custom date format here
        alert('Please select todays date or previous date');

    }
}

score 0 · Answer 5 · edited May 23 '17 at 12:23

You can use regular expression to do the same.

Convert the string to date using regular expression and then use < or > or <= or >= to compare.

$scope.compare = function() {
   var date1 = "30-11-2015";
   var date2 = "1-12-2015";
   var d1 = new Date( date1.replace( /(\d{2})-(\d{2})-(\d{4})/, "$2/$1/$3") );
   var d2 = new Date( date2.replace( /(\d{2})-(\d{2})-(\d{4})/, "$2/$1/$3") );
   alert(d1 < d2);
  };

Reference: Stackoverflow

Can not compare date using Angular.js

5 Answers5

Solution 1

Solution 2