CODEWITHSUNDEEP
javascript
okezumi
okezumi

Reputation: 45

Disable button during weekend + base on hours

I just give up doing this and need help because my brain finally stuck...

here is the situation

I want this button [ Submit Form ] to be disabled (not disappear) base on time, let say I want this button to work normally every day start from 5:00 PM - 12:00 AM but after that this button will be disabled and user cannot be clicking the button (the button just freeze) it also better with message saying that submit form only available during bussiness hour or so

this button also only work every day except on the weekend so that people cannot submit any form during the weekend (sat and Sunday)

the time is base on my current country time... emmm this is hard to explain, I mean.. like UTC +8 pacific time? because the user that submits this form base on my local time

if someone can help or willing to try.. it mean alot to me

update: this is the closed script that I found that almost what I want except they do not disable the button during weekend

<input class="submit" type="submit" id="checktime" value="Check"/>

<script type="text/javascript" defer="defer">
<!-- 
var enableDisable = function(){
    var UTC_hours = new Date().getUTCHours() +1;
    if (UTC_hours > 17 && UTC_hours < 24){
        document.getElementById('checktime').disabled = false;
    }
    else
    {
        document.getElementById('checktime').disabled = true;
    }
};
setInterval(enableDisable, 1000*60);
enableDisable();
// -->
</script>

Credit this code I get from member stackoverflow : Marko from 2014

Upvotes: 0

Views: 887

Answers (2)

tevemadar
tevemadar

Reputation: 13205

Whatever you do, remember that you will have to check validity of submission time on the server side too. Disabling a button in the browser will not stop 'hackerish' users to submit the form/anything.

Otherwise the best what you can do is running a check periodically and enabling/disabling the button with that granularity (e.g. every 5 seconds or so).

setInterval(function(){
   var now=new Date();
   document.getElementById("culprit").disabled=now.getSeconds()<30;
   document.getElementById("time").innerHTML=now.getSeconds();
},5000);
<button id="culprit">Clicky</button>
<div id="time"></div>

This small demo checks if it is the first or the second half of the minute (that is already boring enough to wait for, even if it displays the time), for your real code you would need the more sophisticated test suggested in @StefanOctavian's answer:

var now = new Date()
document.getElementById("culprit").disabled=now.getDay() >= 5 || now.getHours() < 17;

Upvotes: 1

Stefan Octavian
Stefan Octavian

Reputation: 620

If you want to achieve this using only javascript, you can use the Date object like this: when the page loads, get the information about the current day and hour and disable the button if neccessary:

var now = new Date()
if(now.getDay() >= 5 // Saturday & Sunday
   || (now.getHours() >=  5 && now.getHours() < 12))
     button.disabled = true

Then, to enable it again when the clock steucks 12 AM, you could get the interval of time between Date.now() and now.setHours(12) and use setTimeout to reactivate the button then.

Upvotes: 0

Related Questions