user1646528
user1646528

Reputation: 437

Regular expression for HH:MM:SS

I have a reqular expression that matches HH:MM e.g. 12:23 and it is:

function IsValidTime(timeString)
{
    var pattern = /^\d?\d:\d{2}$/;
    if (!timeString.match(pattern))
        return false;
}

How do I change this line:

var pattern = /^\d?\d:\d{2}$/;

to check for a string that is formatted with seconds like so: HH:MM:SS e.g. 12:23:05

Upvotes: 6

Views: 24175

Answers (5)

Durvesh Kumar
Durvesh Kumar

Reputation: 1

enter code here

            function fromTimeFunction(){
                var from_time = document.getElementById("form_time").value;
                let regex = new RegExp(/^(?:2[0-3]|[01][0-9]):[0-5][0-9]:[0-5][0-9]$/);
                if (from_time == "") {
                    document.getElementById("form_time_text").innerHTML = "Please Fill from minutes field for selected user.";
                    return "false";
                }
                if (regex.test(from_time) != false) {
                    document.getElementById("form_time_text").innerHTML = "";
                    return "true";
                } else {
                    document.getElementById("form_time_text").innerHTML = "Please select from minutes field for selected user.";
                    return "false";
                }
            }
            function toTimeFunction(){
                var to_time = document.getElementById("to_time").value;
                let regex = new RegExp(/^(?:2[0-3]|[01][0-9]):[0-5][0-9]:[0-5][0-9]$/);
                if (to_time == "") {
                    document.getElementById("to_time_text").innerHTML = "Please Fill to minutes field for selected user.";
                    return "false";
                }
                if (regex.test(to_time) != false) {
                    document.getElementById("to_time_text").innerHTML = "";
                    return "true";
                } else {
                    document.getElementById("to_time_text").innerHTML = "Please select to minutes field for selected user.";
                    return "false";
                }
            }
<!doctype html>
<html lang="en">
    <head>
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <title>Project Details</title>

        <!-- Bootstrap -->
        <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-GLhlTQ8iRABdZLl6O3oVMWSktQOp6b7In1Zl3/Jr59b6EGGoI1aFkw7cmDA6j6gD" crossorigin="anonymous">
    </head>
    <body>
        <section>
            <div class="container" align="center">
                <div class="row mt-5">
                    <div class="col-md-3"></div>
                    <div class="col-md-6">
                        <div class="card">
                            <div class="card-header">
                                <h3>Time Validation in HH:MM:SS format</h3>
                            </div>
                            <div class="card-body">
                                <form action="" method="POST" class="mt-5">
                                    <div class="row">
                                        <div class="col-md-6">
                                            <div class="form-group">
                                                <div class="row">
                                                    <div class="col-md-5">
                                                        <label for="form_time">From Time</label>
                                                    </div>
                                                    <div class="col-md-7">
                                                        <input type="text" class="form-control" id="form_time" onblur="fromTimeFunction()">
                                                        <p id="form_time_text" style="color:red; font-size: 11px;"></p>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="col-md-6">
                                            <div class="form-group">
                                                <div class="row">
                                                    <div class="col-md-4">
                                                        <label for="to_time">To Time</label>
                                                    </div>
                                                    <div class="col-md-8">
                                                        <input type="text" class="form-control" id="to_time"  onblur="toTimeFunction()">
                                                        <p id="to_time_text" style="color:red; font-size: 11px;"></p>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <button type="submit" class="btn btn-success">Submit</button>
                                </form>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-3"></div>
                </div>
            </div>
        </section>
        <!-- Bootstrap Link -->
        <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" integrity="sha384-w76AqPfDkMBDXo30jS1Sgez6pr3x5MlQ1ZAGC+nuZB+EYdgRZgiwxhTBTkF7CXvN" crossorigin="anonymous"></script>
    </body>
</html>

Upvotes: 0

sourcecode
sourcecode

Reputation: 4601

Validate time in format as“ hh:mm am/pm ” in javascript

function timeValidation(strTime) {
           var timeFormat = /^(?:1[0-2]|0?[0-9]):[0-5][0-9]\s?(?:am|pm)?/;
           return timeFormat.test(strTime);
       }

timeValidation("12:30 PM") // return true

timeValidation("12:30 ") // return false

timeValidation("27:30 AM") // return false

Upvotes: 0

Christoph
Christoph

Reputation: 51201

Basing on your regex for detecting 99:99:99, the following regex would suffice:

/^\d?\d:\d{2}:\d{2}$/

or a bit more sophisticated

/^\d?\d(?::\d{2}){2}$/

but much better would be (because it correctly matches the ranges):

/^(?:[01]?\d|2[0-3]):[0-5]\d:[0-5]\d$/

which would conform the function name IsValidTime...

Upvotes: 0

h2ooooooo
h2ooooooo

Reputation: 39532

Something as simple as the following should work:

/([01][0-9]|2[0-3]):[0-5][0-9]:[0-5][0-9]/g

Regex Explanation:

  • ([01][0-9]|2[0-3])
    • A collection of the following:
    • [01][0-9] the characters "0" or "1" followed by any digit between 0 and 9
    • | - or
    • 2[0-3] the character "2" followed by a digit between 0 and 3
  • : a literal colon
  • [0-5][0-9] - any digit between 0 to 5 followed by any digit between 0 and 9
  • : a literal colon
  • [0-5][0-9] - any digit between 0 to 5 followed by any digit between 0 and 9

Demo:

Regex101

Upvotes: 11

Tim Pietzcker
Tim Pietzcker

Reputation: 336158

/^(?:2[0-3]|[01][0-9]):[0-5][0-9]:[0-5][0-9]$/

for 24-hour time, leading zeroes mandatory.

/^(?:2[0-3]|[01]?[0-9]):[0-5][0-9]:[0-5][0-9]$/

for 24-hour time, leading zeroes optional.

/^(?:1[0-2]|0[0-9]):[0-5][0-9]:[0-5][0-9]$/

for 12-hour time, leading zeroes mandatory.

/^(?:1[0-2]|0?[0-9]):[0-5][0-9]:[0-5][0-9]$/

for 12-hour time, leading zeroes optional.

Upvotes: 32

Related Questions