Comparing JavaScript dates not working as intended

Question

I am working on creating a form which should only be submitted during opening hours of a business. Using the alert calls to show me the times of each of the date variables I can see that the times are all as expected but somehow the form is submitted no matter what the time. I would like to ask for help with getting this to work as I intend please. I have experimented with changing the expressions within the if-else statement already with no success.

To explain the dates; opening hours during lunch are 12 noon till 2 pm and opening hours during evening are 5 pm till 11 pm.

This is the javascript function to check whether or not to submit the form:

function startOrder()
{
    var now = new Date();
    //var d = new Date(year, month, day, hours, minutes, seconds, milliseconds);
    var lunchOpen = new Date(2015, 11, 5, 12, 00, 00, 00);
    var lunchClose = new Date(2015, 11, 5, 14, 00, 00, 00);
    var eveningOpen = new Date(2015, 11, 5, 17, 00, 00, 00);
    var eveningClose = new Date(2015, 11, 5, 23, 00, 00, 00);

    alert("NOW: " + now);
    alert("LUNCH OPEN: " + lunchOpen);
    alert("LUNCH CLOSE: " + lunchClose);
    alert("EVENING OPEN: " + eveningOpen);
    alert("EVENING CLOSE: " + eveningClose);

    if ((now > lunchOpen) && (now < lunchClose) == false)
    {
        document.getElementById('error_Message').innerHTML = "Sorry, we're not open at the moment. You can check our opening times <a href=\"information.html\" class=\"content_Links\">here</a>.";
    }
    else if ((now > eveningOpen) && (now < eveningClose) == false)
    {
        document.getElementById('error_Message').innerHTML = "Sorry, we're not open at the moment. You can check our opening times <a href=\"information.html\" class=\"content_Links\">here</a>.";
    }
    else
    {
        document.forms["startOrderForm"].submit();
    }
}

At some point I will need to change all the date variables which hold the current date's opening hours so that they contain the current date's year, month and day like this...

var lunchOpen = new Date(now.getFullYear(), now.getMonth(), now.getDate(), 12, 00, 00, 00);

I will note that I am aware this system will not be completely reliable because a client's device may not have the correct time set. I have a solution to this that I will implement later.

Many thanks for all the help. If you need any extra details just leave a comment. I do hope I am not making a stupid mistake here.

mjwjon · Accepted Answer · 2015-12-05 02:10:00Z

2

if ((now > lunchOpen) && (now < lunchClose) == false)

This IF line is being evaluated as

(now > lunchOpen) && ((now < lunchClose) == false)

To be evaluated as intended, change your code to

if ((now>lunchOpen && now<lunchClose) == false)

This also goes for this line

if ((now > eveningOpen) && (now < eveningClose) == false)

Should be

if ((now>eveningOpen && now<eveningClose) == false)

edited Dec 5, 2015 at 2:10

answered Dec 5, 2015 at 1:53

mjwjon

3161 silver badge4 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

RobG Over a year ago

Just get rid of the == false.

Oli Over a year ago

@RobG removing the == false will not help at all

Oli Over a year ago

@firstTimer Thanks for your answer, works great now!

Robusto · Accepted Answer · 2015-12-05 01:12:47Z

1

One error I see is that you have

var now = Date();

It should be:

var now = new Date();

The way you have it, now will not be an instance of Date.

answered Dec 5, 2015 at 1:12

Robusto

32k8 gold badges59 silver badges79 bronze badges

1 Comment

Oli Over a year ago

Thanks for your reply @Robusto. I have just changed this and tested it at this time, which should not allow the form to be submitted. The form still submits though. Thanks for recognising this error, I have updated the code in the question to match what I still have which doesn't work as intended.

Lucero · Accepted Answer · 2015-12-05 02:25:24Z

You have different issues with your code. First you have to check the operator precedence of == and < as suggested by firstTimer. Since the outcome of a < or > comparison is already a boolean, don't compare this again but use it in the if condition directly (you can still negate with ! if really necessary).

The second issue though is a logic issue: you'll write that you're not open if the time is not in the lunch timeframe, which will in consequence only do the evening comparison when it is in the lunch timeframe. That makes no sense...

I'd therefore do a combined positive check and otherwise assume it's closed, like this:

if (((now >= lunchOpen) && (now < lunchClose)) ||
    ((now >= eveningOpen) && (now < eveningClose)))
{
    document.forms["startOrderForm"].submit();
}
else
{
    document.getElementById('error_Message').innerHTML = "Sorry, we're not open at the moment. You can check our opening times <a href=\"information.html\" class=\"content_Links\">here</a>.";
}

The third problem (which you are aware of) is with the dates, you use a day, month and year but I assume that you're only after the time. If you want to stick to Date, take the date part (day, month, year) from the now when constructing the opening and closing time variables.

Also, you write that the client may have the wrong time set. That's the least of the problems. A malicious user could just change that and submit things at unsupported times. Therefore, doing such client-side validation must always be backed by subsequent server validation. The client part is only there to give the user quick feedback, but it cannot serve a real validation purpose as far as data validity goes.

Collectives™ on Stack Overflow

Comparing JavaScript dates not working as intended

3 Answers 3

3 Comments

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

3 Comments

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related