Home > Forum > Actions > Implementing a Countdown Timer on a Form – Anyone Done This Before?

Implementing a Countdown Timer on a Form – Anyone Done This Before?
0

Hi everyone,

We're working on a process in WEBCON where we need to display a countdown timer on a form. Specifically, we want the timer to be shown in the [time until next adjustment] field, counting down to the next scheduled update. The timeout is set to update the [value] field, and the countdown should dynamically reflect the remaining time until that happens.

Has anyone implemented something similar ? If so, how did you approach it?

Any insights or best practices would be greatly appreciated!

MVP

Hi,
you can use the html attribute.
Below is a sample code, in place of the date insert a reference to the date that will designate the end of time.
Regards

-----the form cuts off part of the code, the entire screen is




function startCountdown(targetDate) {
let countdownElement = document.getElementById("countdown");
let targetTime = new Date(targetDate).getTime();

let interval = setInterval(function () {
let now = new Date().getTime();
let timeLeft = targetTime - now;

if (timeLeft <= 0) {
clearInterval(interval);
countdownElement.textContent = "End of Time!";
return;
}

let days = Math.floor(timeLeft / (1000 * 60 * 60 * 24));
let hours = Math.floor((timeLeft % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
let minutes = Math.floor((timeLeft % (1000 * 60 * 60)) / (1000 * 60));
let seconds = Math.floor((timeLeft % (1000 * 60)) / 1000);

countdownElement.textContent = `${days}d ${hours}h ${minutes}m ${seconds}s`;
}, 1000);
}

startCountdown("2025-12-31T23:59:59");

Privacy overview

This website uses cookies so that we can provide you with the best user experience possible. Cookie information is stored in your browser and performs functions such as recognizing you when you return to our website and helping our team to understand which sections of the website you find most interesting and useful.


To see a full list of the cookies we use and learn more about their purposes, visit our Privacy Policy.