time input validation

bbvic · Apr 13, 2005

I am trying to make time input validation.

time input format is HH:MM

when the user types time, i want to check it while typing.

How can I start??

-----code----
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"

http://www.w3.org/TR/html4/loose.dtd">

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Untitled Document</title>
</head>

<body>

<input type="text" name="t2" value ="time">
</body>
</html>
<script type="text/javascript">
function timevalid() {

}
</script>

DreamerZ · Apr 13, 2005

You could use the indexOf() method to locate the : (colon) and then check each piece prior to and after it to the end.

http://www.w3schools.com/js/js_obj_string.asp

has a good section on string objects.

DreamerZ

bbvic · Apr 13, 2005

this what I have..
But if I want to check while typing...how can I do???

Thank you in advance
------------------

<html>
<head>
<SCRIPT LANGUAGE="JavaScript">
function timeValid(timeNo) {

var reg = /^(\d{1,2})

\d{2})$/;
if (timeNo.match(reg)) {
alert( "This IS a valid time.");
return true;
} else {
alert( "This is an INVALID time!" );
return false;
}
}
</script>

<h3>Time Validation</h3>
</head>
<body>
Time: <input name = "timeNo" type="TEXT"><br><br>
<input type = "button" value="Validate" onClick="timeValid(timeNo.value)">
</body>
</html>

BillyRayPreachersSon · Apr 13, 2005

Change the onclick to onkeypress. However, you should remove the alert first - for obvious reasons ;o)

Dan

[tt]D'ya think I got where I am today because I dress like Peter Pan here?[/tt]
[banghead]

bbvic · Apr 13, 2005

well I tried that way..but it did not work..
would you please help...

DreamerZ · Apr 13, 2005

How about onKeyUp?

DreamerZ

DreamerZ · Apr 13, 2005

Oh. You need to put the onkeypress or onKeyUp in the tag for the text field. You have onClick in the button field, which is fine, but not for what you want to do.

DreamerZ

BillyRayPreachersSon · Apr 13, 2005

Oh yes - sorry - I forgot to mention that!

Dan

[tt]D'ya think I got where I am today because I dress like Peter Pan here?[/tt]
[banghead]

bbvic · Apr 14, 2005

hi..
I tried several times..but I could not solve this problem.
What I am trying to do...I want to check while typing..
Would you please help??

Thank you in advance

CliveC · Apr 14, 2005

Validation is by and large an outdated concept. If you want a user to enter valid data, force them to. In this case a simple select box for HH and another for MM should do the trick.

Clive

http://tubularity.com

http://PalliativeCareConsulting.org

bbvic · Apr 14, 2005

This is what I have now..
but...when I begin to type, alert sign comes...
Would you please help me how I can fix it?
Thank you in advance.

<html>
<head>
<script>
function isNumber(field) {

var reg = /^(\d{1,2})

\d{1,2})$/;

if (!reg.test(field.value)) {
alert("invalid!");
field.value = field.value.replace(/^(\d{1,2})

\d{1,2})/g,"");

}
}

</script>
</head>

<body>
Time: <input name = "timeNo" type="TEXT" onkeyup="isNumber(this)">
</body>
</html>

bbvic · Apr 14, 2005

or...I have another validation,
but it could not check the correct values...
would you please tell me why it does not work??
Thank you in advance
<html>
<head>
<title> field test </title>
<head>
<script Language="JavaScript">
var reg = /^(\d{1,2})

\d{2})$/;
function checkfield(entered, alertbox) {
if (entered.value!=reg || entered.value=="") {
alert(alertbox);
return false;
}
return true;
}

</script>
</head>
<body>

<form method="post" action="test2.htm">
<p>time1: <input type="text" name="time1" size="32" value="" onBlur = "checkfield(this, 'invalid Time Format- HH:MM');"><br>

time2: <input name="lname" type="time2" size="32" value ="" onBlur = "checkfield(this, 'invalid Time Format- HH:MM');"><br>

<p><input type="submit" value="Submit" name="submit"></p>
</form>

</body>
</html>

cLFlaVA · Apr 14, 2005

No validation needed:

Code:

<form name="f">
  <select name="hour">
    <option value="01">01</option>
    <option value="02">02</option>
    <option value="03">03</option>
    <option value="04">04</option>
    <option value="05">05</option>
    <option value="06">06</option>
    <option value="07">07</option>
    <option value="08">08</option>
    <option value="09">09</option>
    <option value="10">10</option>
    <option value="11">11</option>
    <option value="12">12</option>
  </select>
  :
  <select name="minute">
    <option value="01">01</option>
    <option value="02">02</option>
    <option value="03">03</option>
    <option value="04">04</option>
    <option value="05">05</option>
    ...
  </select>

  <select name="ampm">
    <option value="am">AM</option>
    <option value="pm">PM</option>
  </select>
</form>

*cLFlaVA
----------------------------
[tt]a frickin' twelve-gauge, what do you think?[/tt]
[URL unfurl="true"]http://www.coryarthus.com/[/url]
[banghead]

bbvic · Apr 14, 2005

right...I understand...
but if I want to type in text field, then how to check the validation...
would you please help..

CliveC · Apr 14, 2005

If you insist on validating then auto-plug the colon and check for HH being numeric and less than 24 (or 12) and the right box being numeric and less than 59.

Clive

http://tubularity.com

http://PalliativeCareConsulting.org

cLFlaVA · Apr 14, 2005

less than 60.

*cLFlaVA
----------------------------
[tt]a frickin' twelve-gauge, what do you think?[/tt]
[URL unfurl="true"]http://www.coryarthus.com/[/url]
[banghead]

bbvic · Apr 14, 2005

ok...this is what I have so far...
it can check only one input text field...
what if I have more than one input text field, how can I check each by each...
well..I tried several ways..it did not work..
would you please help me??
--------------code---------------------
<html>

<HEAD>

<SCRIPT LANGUAGE="JavaScript">

function IsValidTime(timeStr) {

var timePat = /^(\d{1,2})

\d{2})?$/;

var matchArray = timeStr.match(timePat);
if (matchArray == null) {
alert("Time is not in a valid format.");
return false;
}
hour = matchArray[1];
minute = matchArray[2];
if (hour < 0 || hour > 24) {
alert("Hour must be between 1 and 12. (or 0 and 23 for military time)");
return false;
}

if (minute<0 || minute > 59) {
alert ("Minute must be between 0 and 59.");
return false;
}
}

</script>
</HEAD>

<BODY>

<center>
<form name=timeform >

time1 <input type=text name=time><br>
time2 <input type=text name=timeA><br>

<input type="submit" value="Submit" onClick="return IsValidTime(document.timeform.time.value);">
</form>
</center>

</body>
</html>

Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

time input validation

bbvic

Technical User

DreamerZ

Programmer

bbvic

Technical User

BillyRayPreachersSon

Programmer

bbvic

Technical User

DreamerZ

Programmer

DreamerZ

Programmer

BillyRayPreachersSon

Programmer

bbvic

Technical User

CliveC

Programmer

bbvic

Technical User

bbvic

Technical User

cLFlaVA

Programmer

bbvic

Technical User

CliveC

Programmer

cLFlaVA

Programmer

bbvic

Technical User

Similar threads

Part and Inventory Search

Sponsor