Enable Button During Certain Day & Time

I am trying to enable a button ONLY during 5PM to 10PM every day, except Monday. When the button is disabled,

should show up (like a notification to the visitor

Solution 1:

DEMO

Try setting the attribute on the element, instead of a property on the element object:

document.getElementById('checktimer').setAttribute('disabled');

To remove it, use

document.getElementById('checktimer').removeAttribute('disabled');

As others have mentioned, you should cache the checktimer element in a variable, instead of looking it up each time.

A couple of other minor things I changed:

• Removed those Javascript comment things you had. You don't need those.
• Added quotes around the value of the id attribute for your p element.

Solution 2:

This would work:

var enableDisable = function(){                    
    var UTC_hours = newDate().getUTCHours(); //Don't add 1 here       var day = newDate().getUTCDay();  //Use UTC here alsoif (day != 1 && UTC_hours >= 17 && UTC_hours < 22){
        document.getElementById('checktimer').disabled = false;
        document.getElementById('timer').style.display = 'none';
    }else{
        document.getElementById('checktimer').disabled = true;
        document.getElementById('timer').style.display = 'block';
    }
};

setInterval(enableDisable, 1000*60);
enableDisable();

Cheers

Solution 3:

Just get rid of the HTML comment <!-- or comment it with //

<scripttype="text/javascript">//<!-- var enableDisable = function(){
                var UTC_hours = newDate().getUTCHours() +1;
                var day = newDate().getDay();
                if (day == 1){
                    document.getElementById('checktimer').disabled = true;
                    document.getElementById('timer').style.display = 'block';
                }
                else{
                if (UTC_hours > 16 && UTC_hours < 22){
                    document.getElementById('checktimer').disabled = false;
                    document.getElementById('timer').style.display = 'none';
                }
                else
                {
                    document.getElementById('checktimer').disabled = true;
                    document.getElementById('timer').style.display = 'block';
                }
                }
            };
            setInterval(enableDisable, 1000*60);
            enableDisable();
            // --></script>

Your script should then work normally

Solution 4:

Actually, you shouldn't enable or disable the button based on JavaScript DateTime because it gets the client machine's date, meaning that if the user changes it's system date the button will be enabled. You should verify it on the server-side code, such as PHP or ASP. There, you can check for datetime validation, and write the button on the page, or not.