Javascript RegEx: validate time

Question

I have a stopwatch variable that can get value in the following format: HH:MM:SS most of the time. 'HH' can go past 24 hours - basically any valid number.

I am not that good with this regex thingy, but was able to write something that is good for most part but fails to validate if the hour is single digit. Ex. below regex pass the time 1:10:09, though it is invalid. valid hour part should be 01.

//var stopWatchTime = '02:10:09'; //Valid
//var stopWatchTime = '00:10:09'; //Valid
//var stopWatchTime = '1234:10:09'; //Valid
//var stopWatchTime = ':10:09'; //Invalid
//var stopWatchTime = 'ax:10:09'; //Invalid
var stopWatchTime = '1:10:09'; //Invalid, should be 01:10:09. 

if(!stopWatchTime .match(/^\d+:\d{2}:\d{2}$/)){
    alert('invalid time- ' + stopWatchTime);
}
else{
    alert('valid time - ' + stopWatchTime);
}

What should I change in the regex to say it should check for any number but should have 2 digits or more in hour part?

Solution 1

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

Change the + to a {2,} to allow it to have two or more characters

If you want to see the things that matches and doesn't match you can play with it here http://regexr.com?31fu4

EDIT: Also if you only want to match up to 59 in the hours/minutes part use

^\d{2,}:(?:[0-5]\d):(?:[0-5]\d)$

Solution 2

// use this function to  validate time in HH:mm formate

function validate_time(time){
    var a=true;

    var time_arr=time.split(":");
    if(time_arr.length!=2){           
        a=false;
    }else{
        if(isNaN(time_arr[0]) || isNaN(time_arr[1])){                
            a=false;
        }
        if(time_arr[0]<24 && time_arr[1]<60)
        {

        } else{
            a=false;
        }         
    }
    return a;

}

Solution 3

Another solution could be:

 $('#input-horaIni, #input-horaFin').blur(function () {
        var validTime = $(this).val().match(/^([01]?[0-9]|2[0-3]):[0-5][0-9]$/);
        if (!validTime) {
            $(this).val('').focus().css('background', '#fdd');
        } else {
            $(this).css('background', 'transparent');
        }
    });

This works for me... Based on page: http://www.mkyong.com/regular-expressions

Comments

[Sri Reddy]

Excellent solution and great link. You won't believe I took some time to draft this question. As I didn't want to look stupid.. and I tried various options except for this {2,}. But thanks for the quick response. I can only accept this answer in another 7 minutes. Waiting...

[Sri Reddy]

...also Ghost thanks for that extra line at the end to check for minutes/seconds match 0-59. It is really very helpful.