[cosyxu]

Good morning,

I am currently using datetime control to let a user to input a DD/MM/YYYY,HH:mm format datetime, however I was wondering is it possible to set the mm to either 0 and 30 mintues?

For example: a user can only select either 10:00 or 10:30.

Thank you,
Yuan

[amosbatto]

You can create a "change" event handler with control.setOnchange() to reset the minutes to 0 or 30 after the user changes the time. However, I discovered that you can't call setValue() inside the event handler, because it will cause the web browser to enter an infinite loop and freeze up.

The trick is to use window.setInterval() to set a timer to execute code that will change the time a second later after the user changes the value. Then call window.callInterval() to remove the timer.

Here is the JavaScript you can use:

Code: Select all

var appointmentTimer = null;

$("#appointmentTime").setOnchange(function(newTime, oldTime) {
  var oTime = moment(newTime);
  var min = oTime.minutes();
  if (min == 0 || min == 30) {
    return;
  }
  else if (min < 15) {
    oTime.minutes(0);
  }
  else if (min >= 15 && min <= 45) {
    oTime.minutes(30);
  }
  else if (min > 45) {
    oTime.hours( oTime.hours()+1 );
    oTime.minutes(0);
  }
  
  appointmentTimer = setInterval(function() { 
    $("#appointmentTime").setValue( oTime.format("YYYY-MM-DD HH:mm") );
    clearInterval(appointmentTimer);
  }, 1000);
  
});

Where "appointmentTime" is the ID of the datetime field.

Here is a sample DynaForm to show its implementation:

Set Time interval.json

(2.37 KiB) Downloaded 324 times

[cosyxu]

Hi amosbatto,

Thanks for your solution.

Regards,
yuan