Open Modal in a specific date/time

Question

I've been developing a web app, and I was wondering if there is a way to display a model at a specific date/time.

In the app, the user can book task or reminders, so when I read from the database the task a specific I want to schedule the display of the modal at the date/time specify by the user.

For instance, the user book a task for 2013-09-23 at 14:00 and I want to display a message in the modal.

I kwon we can set time interval with the JavaScript:

setInterval(function () { 
    showModal(); 
}, 10 * 1000);

But how to specify an hour like in the sample?

Answer 1

In that setInterval call, 10 * 1000 means 10 times 1000 milliseconds, or in other words 10 seconds. If you want an hour, it's just a bigger number. 1000 * 60 * 60 is an hour.

However, setInterval is for running a function multiple times. Unless you wanted it to be called every hour, you are probably looking for setTimeout instead. setTimeout schedules a function to be run once after the time period expires.

Answer 2

You can try like this.

1. Make your setInterval() to run for a continues time.
2. Compare the date, by converting them to milliseconds. and a comparison condition.

---

setInterval(function () { 
 var date = new Date("2013-09-23 14:00");
 var schDateSecs = Date.parse(date);
 var currentDate = new Date();
 var schCurrentSecs = Date.parse(currentDate);
 if (schDateSecs == schCurrentSecs) {
    //execute
    showModal(); 
 }
}, 10 * 1000);

Answer 3

Thank you all for your answers, they help me come up with a solution:

function setNotification(notificationDate, notificationCallback){
     var currentDate = new Date();
     var date = new Date(notificationDate);
     var interval = date - currentDate; 

    if(interval > 0)
        window.setTimeout(function(){ notificationCallback(item)}, interval); //notificationCallback = showModal()

}