CODEWITHSUNDEEP
javascripthtmldatedatetimecomparison
Oli
Oli

Reputation: 314

Comparing JavaScript dates not working as intended

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.

Upvotes: 1

Views: 71

Answers (3)

Lucero
Lucero

Reputation: 60276

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.

Upvotes: 1

mjwjon
mjwjon

Reputation: 316

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)

Upvotes: 2

Robusto
Robusto

Reputation: 31913

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.

Upvotes: 1

Related Questions