Improve company productivity with a Business Account.Sign Up

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 2120
  • Last Modified:

Time field input mask

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
0
scross1276
Asked:
scross1276
  • 3
  • 3
  • 3
  • +1
1 Solution
 
jaysolomonCommented:
<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>
0
 
scross1276Author 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?
0
 
GwynforWebCommented:
try this

<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" onkeyup="formatTime(this);" />
</form>
</body>
</html>
0
Get expert help—faster!

Need expert help—fast? Use the Help Bell for personalized assistance getting answers to your important questions.

 
ZvonkoSystems architectCommented:
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>


0
 
ZvonkoSystems architectCommented:
And here an older discussion on the same topic: http:Q_20783895.html

0
 
jaysolomonCommented:
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
0
 
ZvonkoSystems architectCommented:
The GwynforWeb is so chocked that he can not complain.
He has to ask his hubby first :)
0
 
jaysolomonCommented:
Its no big deal, it should have been splitted but thats another day
0
 
scross1276Author 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.
0
 
scross1276Author Commented:
sure
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

Join & Write a Comment

Featured Post

Free Tool: ZipGrep

ZipGrep is a utility that can list and search zip (.war, .ear, .jar, etc) archives for text patterns, without the need to extract the archive's contents.

One of a set of tools we're offering as a way to say thank you for being a part of the community.

  • 3
  • 3
  • 3
  • +1
Tackle projects and never again get stuck behind a technical roadblock.
Join Now