jQuery datetimepicker validation - Timepicker UI

Question

I am building a jQuery plugin to create subtitles on videos and I using the library Timepicker UI to define the begin and end, that each subtitle start and end.

I am using an input tag:

<input class="HoursStart hasDatepicker valid" type="text"
 value="0" name="HoursStart">

And the javascript code using the format (hh:mm:ss):

$('.HoursStart ').timepicker(
{
    showSecond: true,
    timeFormat: 'hh:mm:ss'
});

The problems are with the validation:

1. Is there a way to just allow the input to accept the format hh:mm:ss (just numbers on the correct range) ?

2. Is there a way to make the comparisons between two inputs (something like if (12:21:12 > 11:31:12))?

I really appreciate your help to solve this validation problems. If there is another jQuery library that makes what I want, is not a problem for me to change to other jQuery library.

Answer 1

Here is a fiddle for testing the regex and comparing the time strings:

$(function () {
   var timeRegex = new RegExp('([0-9]{2}):([0-9]{2}):([0-9]{2})');
    var originalTime = "00:10:20";

    $('#submit').click(function(){
       var time = $.trim($('#time').val());
       var isTime = timeRegex.test(time);
       var greater = time > originalTime;
        var testString = "Is correct format: "+isTime +", is greater:" + greater;
       window.alert(testString); 
    });
});

more discussion on comparing that time format How can I compare two time strings in the format HH:MM:SS?