Skip to main content
RQ82
RQ82
Inspiring
June 21, 2022
Question

Time Field

  • June 21, 2022
  • 2 replies
  • 4391 views

Hi there!

Thanks to a bit of research from previous discussions, I have been able to get a time field working the way I was hoping for. I basically want to add a time field that accepts this 00:00 format. To do this, on the field I added a Custom Keystroke Script (thanks @try67 for this):

 

if (event.change && AFMergeChange(event).length==2) event.change+=":";

 

This works great, as it automatically adds the ":" as soon as I enter the first two characters. 

 

The only thing I am trying to do now is set the field so that it only accepts numbers and the ":", but no letters. I haven't been able to solve this, and am hoping someone may be able to help me only allow numbers and ":" to be accepted in this field.

 

Any help is greatly appreciated. Thanks so much in advance.

This topic has been closed for replies.

2 replies

bebarth
Community Expert
bebarthCommunity Expert
Community Expert
June 22, 2022

Hi,

As you have a "am/pm" radio button, I guess hours must be <=12 and minutes <59, which is not the case with the current script. You need a regular expression to check hours and minutes.

You can place this script for your doc-level function:

 

function TimeFormat() {
	if (event.change && AFMergeChange(event).length==2) event.change+=":";
	var aTester=event.value.split("");
	aTester.splice(event.selStart, event.selEnd-event.selStart, event.change);
	var testeChaine=aTester.join("");
	var timeRegEx=/^((0[1-9]?|1[0-2]?)(:([0-5][0-9]?)?)?)?$/;
	event.rc=timeRegEx.test(testeChaine);
}

 

and in custom keystroke script:

 

if(!event.willCommit) TimeFormat();
else {
	var timeRegEx=/^(0[1-9]|1[0-2]):[0-5][0-9]$/;
	event.rc=event.value=="" || timeRegEx.test(event.value);
}

 

@+

RQ82
RQ82Author
Inspiring
July 25, 2022

Thank you @bebarth and @try67 for your replies on this and sorry for not replying sooner.

@bebarth I'm trying to follow along to your reply ... yes time would ideally look like this:

12:00

1:00

2:00

3:00

etc.

I get what I think you're saying, that the problem with what I did is that if I want to enter 1:30, it would display as 13:0

From what I can tell in your example, time between  1:00 - 9:59 will not work unless someone enters 0 first, so it would be 01:00 for example. 

I assume there is no way for this to work to be able to show 1:00 or 11:00 depending on the time, as 1:00 would need to be 01:00?? When I first tried out the example I was confused that I needed to enter a 0, but then I realized that if I tried entering 1:00 my example was 10:0. 

Perhaps I set the field to only accept numbers and the :, but it's the responsibility of the person to enter the time correctly. I can't figure out what would be the most ideal, so any feedback is appreciated!

 

bebarth
Community Expert
bebarthCommunity Expert
Community Expert
July 25, 2022

Thank you both! I was just replying when I saw this message.

I think this is along the lines of what I was wondering about and I think is a good solution for what I need. If I wanted to have the ":" no longer auto fill after two digits are entered (ex - 12:49) and make it manual like if someone enters 3 digits (1:26), how would I need to adjust the doc level JavaScript for this, or would this create a new issue I'm not thinking of? I am just thinking since I have to enter it manually if it's 3 digits, to keep it consistent, maybe I should have to enter manually as well if 4 digits. Either way, I think this solution works and I thank everyone for their assistance!


You can only type 3 or 4 digits and add a custom format script.

Custom keystroke script:

if(!event.willCommit) {
	var aTester=event.value.split("");
	aTester.splice(event.selStart, event.selEnd-event.selStart, event.change);
	var testeChaine=aTester.join("");
	var timeRegEx=/^(([1-9]|1[0-2]?)([0-5][0-9]?)?)?$/;
	event.rc=timeRegEx.test(testeChaine);
} else {
	var timeRegEx=/^([1-9]|1[0-2])[0-5][0-9]$/;
	event.rc=event.value=="" || timeRegEx.test(event.value);
}

Custom format script:

if (event.value.length==3) event.value=event.value.substr(0,1)+":"+event.value.substr(1);
else event.value=event.value.substr(0,2)+":"+event.value.substr(2);

@+

    Nesa Nurani
    Community Expert
    Nesa NuraniCommunity Expert
    Community Expert
    June 22, 2022

    Try this:

    event.rc = /^[0-9:]*$/.test(event.change);

    RQ82
    RQ82Author
    Inspiring
    June 22, 2022

    Thanks @Nesa Nurani I updated the Custom Keystroke Script to:

    if (event.change && AFMergeChange(event).length==2) event.change+=":";
event.rc = /^[0-9:]*$/.test(event.change);

    This worked! It doesn't display the keystroke script I entered due to the known bug, however when I pasted the above code in it did work. I have attached my updated PDF for reference. Thanks so much.

     

    try67
    Community Expert
    try67Community Expert
    Community Expert
    June 22, 2022

    If you don't want the script to "disappear" place it in a doc-level function and then just call that function from the field's Keystroke event. This also has the additional benefit that you could use the same code for multiple fields and would only need to update it once if you decided to change it in the future.

    Terms & ConditionsAccessibility statement
    Using the community Terms of use Privacy Cookie preferences Do not sell or share my personal information ad choicesAdChoices