I have a button which I disable depending on whether an datetime has passed, however, this will only work on page load, how can I set a countdown timer so that my button is disabled when the countdown to the nominationCloseDateTime is reached even if the page is already loaded.
<ctx><vars><nominationCloseDateTime>2022-05-10 04:56:00.000Z</nominationCloseDateTime></vars></ctx>
var nominationCloseDateTime = document.controller.getValue('/ctx/vars/nominationCloseDateTime');
if (nominationCloseDateTime < $.now()) {
$('input#nominate').prop('disabled', true);
}
I've calculated the countdown to date in seconds, now whats next?
var nominationCloseDateTimeCountDownSecs = ((new Date(document.controller.getValue('/ctx/vars/nominationCloseDateTime')).getTime()) - new Date().getTime()) / 1000;
Is the following correct?
setTimeout(() => {
$('input#nominate').prop('disabled', true);
}, nominationCloseDateTimeCountDownSecs)
You want to use a setTimeout() function.
For example,
//calculate, in seconds, how much time you want the button to stay enabled.
const calculatedTimeUntilCloseDateTime;
setTimeout(() => {
functionToDisableYourButton();
}, calculatedTimeUntilCloseDateTime)
It will work like below:
setTimeout(() => {
console.log("Delayed for 1 second.");
}, 1000)