We help IT Professionals succeed at work.

Check out our new AWS podcast with Certified Expert, Phil Phillips! Listen to "How to Execute a Seamless AWS Migration" on EE or on your favorite podcast platform. Listen Now

x

Time field input mask

scross1276
scross1276 asked
on
Medium Priority
2,133 Views
Last Modified: 2007-12-19
I've searched all over the internet for several days, and have yet to find anyone that has an input mask for time fields already written, although I know there out there somewhere.  Anyway, I was hoping one of you could help me out with this.  I don't know Javascript very well, so I can't write it.

What I'm looking for is a time field input mask that will automatically format the field to this (hh:mm xm) format, but the user has to be able to input the a or p for am or pm.  I'm trying to avoid using military time.

Thanks,
Steve
Comment
Watch Question

<html>
<head>
<title></title>
<script type="text/javascript">
<!--
function formatTime(strField){
      var oLen = strField.value.length;
            if(oLen == 2){strField.value += ":";}
            if(oLen == 5){strField.value += " ";}
            if(oLen == 7){strField.value += "m";}
}
//(hh:mm xm)
// -->
</script>
</head>
<body>
<form name="form1" method="post" action="">
<input type="text" name="time" maxlength="8" size="8" onkeypress="formatTime(this);" />
</form>
</body>
</html>

Author

Commented:
Thanks for the quick response, and yes, that works great, but the "m" doesn't populate unless I press the letter m, which gives me two m's.  Any ideas?
Unlock this solution with a free trial preview.
(No credit card required)
Get Preview
ZvonkoSystems architect
CERTIFIED EXPERT
Top Expert 2006

Commented:
How about this:

<html>
<head>
<script>
function checkTime(theField){
  val = theField.value;
  time = /^([012]|[012][0-9]|[012][0-9]\:|[012][0-9]\:[0-5]|[012][0-9]\:[0-5][0-9]|[012][0-9]\:[0-5][0-9]\ |[012][0-9]\:[0-5][0-9]\ [ap]|[012][0-9]\:[0-5][0-9]\ [ap]m)$/i;
  if(val.match(time)){
    if(val.length==2) theField.value=val+":";
    if(val.length==5) theField.value=val+" ";
    if(val.length==7) theField.value=val+"m";
  } else {
    theField.value = val.replace(/[^0-9\:\ apm]/gi,'');
  }
}
</script>
</head>
<body onLoad="document.forms[0].userTime.focus()">
<form>
<input type=text name="userTime" maxlength="8" size="7" onKeyUp="checkTime(this)" >
</form>
</body>
</html>


ZvonkoSystems architect
CERTIFIED EXPERT
Top Expert 2006

Commented:
And here an older discussion on the same topic: http:Q_20783895.html

WOW
i write the code and someone else changes one word from onkeypress to onkeyup and they get all 50 glad it was not a 500 pointer
ZvonkoSystems architect
CERTIFIED EXPERT
Top Expert 2006

Commented:
The GwynforWeb is so chocked that he can not complain.
He has to ask his hubby first :)
Its no big deal, it should have been splitted but thats another day

Author

Commented:
I agree with jaysolomon, his code was identical with the exception of the press versus up.  I wanted to split the points, but didn't find the option, so I went with gwynforweb since theirs worked perfecly, but while we're discussing perfect, zvonko's also worked perfectly.  If you can split the points, then give jaysolomon 40, and gwynforweb 10 since gwynforweb just copied it.  If not, everyone needs to understand why I did what I did.

Sorry about the mixup.

Author

Commented:
sure
Unlock the solution to this question.
Thanks for using Experts Exchange.

Please provide your email to receive a free trial preview!

*This site is protected by reCAPTCHA and the Google Privacy Policy and Terms of Service apply.

OR

Please enter a first name

Please enter a last name

8+ characters (letters, numbers, and a symbol)

By clicking, you agree to the Terms of Use and Privacy Policy.